Javascript

Javascript היא שפת תכנות המשמשת להחייאת אתרים. אתה רואה את זה בפעולה בכל פעם שאתה מבקר באתר שיש לו אינטראקציה כלשהי. לימוד Javascript הוא מהיר, קל ומהנה מכיוון שכבר יש לך את כל הכלים הדרושים במחשב שלך ואתה רואה את התוצאות באופן מיידי. נסה את הדוגמה הפשוטה שלב אחר שלב למטה ותהיה בדרך!


תוכנת הורדה:אין צורך

עֲלוּת:חינם

הוראות להתקנת תוכנה:אין צורך

דרישות חומרה:מחשב, מק, רובוטי, מכשיר נייד


מערכות הפעלה נתמכות:Win, Mac, Linux

רמת קושי:1 מתוך 5



נסה זאת!

1. צור תיקיה בכונן הקשיח שלך - קרא לה 'JS Demo'


2. העתק קוד Javascript זה:

 // JavaScript Document // Note: lines that start with two backslashes are comments - not code!  var bePrepared = function () {        // = = = = = = = declare all the variables = = = = = = = =         var tempF, tempC, myActionText, newText;        //get the temp (F) from the HTML page        tempF = document.getElementById('MyInputTemp').value;         // = = = = = = = convert the temp to Celsius (with only one decimal place)        tempC = (5 / 9 * (tempF - 32)).toFixed(1);        // = = = = = = = evaluate the temp (three categories) = = = = = = =         if (tempF = 60) && (tempC = 75) {                 myActionText = ' Take Sunscreen!';             }        // = = = = = = = build a complete sentence = = = = = = =         newText = 'If the temperature is ' + tempF + ' °F (' + tempC + ' °C): ' + myActionText;       //push the sentence back to the HTML page (using the ID of the markup element: 'myAnswer')       document.getElementById('myAnswer').innerHTML = newText;     }; 

והדבק בעורך הטקסט המועדף עליך. פנקס הרשימות של Windows עובד בסדר.

3. שמור את הקובץ כ- 'JS-Example.js' בתיקיה החדשה שיצרת בשלב 1.

4. כעת העתק קוד HTML זה:


       Example Javascript Program for Boy Scout Merit Badge       	 	

Javascript Programming Example

Enter Temperature (°F):

והדבק בעורך הטקסט המועדף עליך. פנקס הרשימות של Windows עובד בסדר.

5. שמור את קוד HTML זה באותה תיקייה וקרא לו 'JS-HTML.htm'

6. לחץ פעמיים על קובץ JS-HTML להפעלת דפדפן. הזן טמפרטורה ולחץ על כפתור GO כדי לראות את התוצאה. נסה כמה טמפרטורות שונות.


אודות התוכנית - דרך דרך

1. קובץ ה- HTML מגדיר את טקסט ועיצוב המידע עבור דף אינטרנט פשוט. אתה יכול לשנות כל דבר שתרצה כדי לראות כיצד זה משפיע על עיצוב הדף. זה לא ממש תכנות, אבל זה כיף לשחק איתו. זה:

א. יוצר כותרת לאתר
ב. אומר לקוד ה- HTML להשתמש ב- Javascript והיכן למצוא את הקוד
ג. מעצב את הטקסט המוצג
ד. מציין תיבת הזנת טקסט עם מזהה = 'MyInputTemp' (Javascript יזדקק לכך)
ה. מציין כפתור עם הכיתוב 'לכו!'
f. כאשר לוחצים על לחצן העכבר, מריץ את פונקציית javascript bePrepared ()
ז. מציג את המחרוזת ב- 'myAnswer' שנוצרת בתוכנית javascript.

2. לקובץ Javascript יש פונקציה אחת הנקראת 'bePrepared ().' הוא מופעל בכל עת שלוחצים על לחצן GO (עיין בשיטת 'onclick' עבור התג 'קלט' = 'כפתור' בקובץ ה- HTML כדי לראות את קריאת הפונקציה).

3. הפונקציה 'bePrepared ()'

א. משיג את הערך שהוזן בתג 'קלט' - 'טקסט' באמצעות מזהה זה: 'MyInputTemp'
ב. הערך מומר לסלקיוס (עם מקום עשרוני יחיד).
ג. הערך צלזיוס מוערך באמצעות סדרת הצהרות IF ומוקצה למשתנה ביטוי פעולה מוצע: 'myActionText'
ד. משפט נוצר על ידי שילוב או 'שרשור' טקסט סטטי כלשהו יחד עם ערכי הטמפרטורה (deg F ו- Deg C) וביטוי הפעולה.
ה. הביטוי החדש מוכנס לשורה האחרונה של דף ה- HTML באמצעות מזהה התג בשורה זו: 'myAnswer'


נסה את זה

1. שנה את הטמפרטורות בהן משתמשים בהחלטות - שנה את הטמפרטורה הנמוכה מ 60 ל 30 מעלות, למשל. הקפד לשנות את זה בשני מקומות! שמור את הקובץ ורענן את הדפדפן (או הפעל מחדש את דף האינטרנט), והזן מספרים חדשים - האם התשובות השתנו בטמפרטורה החדשה?

2. צור טווח טמפרטורות חדש בין 30 ל 60 מעלות והצג אותו - 'תביא כובע וכפפות!'

3. שנה את נוסח הביטויים.

4. הוסף קלט טקסט נוסף - בקש למשל את מהירות הרוח.

5. הוסף כמה אמירות מותנות המעריכות את גורם צינון הרוח.

6. הוסף מעט טקסט כדי להציג את התוצאה של צינון הרוח.


למד עוד

W3schools.com - הדרכה מאורגנת היטב עם הרבה דוגמאות עבודה וקוד מקור

Webmonkey - מדריך Javascript בן חמישה חלקים


משאבים, טיפים, טריקים ורמזים

1. ל- Google Chrome יש תכונה מסודרת.

- התקן את Google Chrome אם עדיין אין לך את זה.

- פתח את דוגמת ה- JS-HTML לעיל ב- Google Chrome (לחץ באמצעות לחצן העכבר הימני על קובץ ה- JS-HTML שיצרת לעיל ובחר 'פתח באמצעות ..' ובחר ב- Chrome)

- לחץ על הגדרות >> כלים >> מסוף Javascript

פעולה זו פותחת חלון קונסולה המציג הודעות שגיאה (ועוד שלל כלים אחרים) שיעזרו לך לפתור את הקוד שלך.

קונסולה זו מועילה מאוד בעת ניפוי באגים בשגיאות JavaScript. ברוב הדפדפנים יש תוספים שעושים דברים דומים.

2. Notepad ++ הוא עורך טקסט חופשי נהדר שתוכנן במיוחד עבור מתכנתים. בדוק את זה כאן .