[שיעור מס' 8] JavaScript

[-Smoxer-]

הכנות ראשונות

בשביל להתחיל ללמוד את השפה המדוברת "JavaScript" עליך לדעת ידע בסיסי ב-HTML
בנוסף, יש כאלה שיגידו שצריך כותבי טקסט "עיליים" בשביל לכתוב את השפה, זה בכלל לא נכון.
כל מה שאתה רק צריך זה רק כתבן פשוט שנמצא בכל מחשב, ידע בסיסי ב-HTML ורצון


שימו לב!
אם אתם גולשי IE תקפוץ לכם מלמעלה הודעה שאם לאפשר את קטעי הקוד של JS.
1) אחרי שתעלו את האתר זה כבר לא יהיה.
2) קטעי הקוד אינם יכולים לעשות לכם כלום (לפחות ברמה שאני מלמד)
בשביל לאשר את הרצת הסקריפט לחצו על ההודעה קליק ימני ו"אפשר תוכן חסום"

רקע

השפה "JavaScript" נולדה ע"י חברת נטסקייפ בשנת 1995 הגרסה הראשונה של JS יושמה לראשונה בדפדפן של נטסקייפ (לא חשבנו אחרת.. ) החל מגרסה 1.0 של הדפדפן. כיום כל הדפדפנים תומכים ב-JS.
כיום הגרסה האחרונה של JS עומדת על 1.6 (החל מ-1.0, 1.1, 1.2 וכן הלאה).
טעות נפוצה של מתחילים היא לחשוב ש-Java ו-JavaScript הם אותו דבר. הם טועים!
(JS(JavaScript הינה שפת צד לקוח, לעומת זאת Java הינה שפה עילית.




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

מתחילים

מכיוון שהשפה נכתבת בתוך דפי HTML עלינו לכתוב תג מסויים ש"יכריז" על התחלת הסקריפט וגמירתו.
בדיוק בשביל זה נרשום:

<script type="text/javascript"><!--JavaScript Code//--></script><noscript>Your browser does not support JavaScript!</noscript>

מה עשינו פה?
קודם כל הכרזנו על קוד JS שרשמנו:

<script type="text/javascript">

אם לא נרשום את הקטע
"type="text/javascript
הדפדפן עלול להתבלבל ולחשוב שזה קוד VBScript
לכן מומלץ לרשום כך.




עד לתגית- </script> (תגית הסגירה) נרשום את קוד ה-JS
וכשרשמנו:

<noscript>Your browser does not support JavaScript!</noscript>

אמרנו שאם יש דפדפן שלא מזהה את JS אז זה יכתוב הודעה זו.




עכשיו אתם בטח תשאלו:

"אם הדפדפן לא מכיר את התגית <script> איך זה שהוא יכיר את <noscript> ?"

אז זהו, שלא!
בדפדפנים החדשים הם יזהו את התגית הזאת וכך לא ידפיסו את שורת הקוד.
וכשרשמנו את <!-- JS CODE //-->
שמנו הערות (ראה פרק 2).
שאם יש דפדפן מיושן הוא לא יציג שאת כטקסט, דפדפן חדש "למד" (יותר נכון אמרו לו) שאחרי התגית <script> יבוא סקריפט של JS.
וכל הוא יתעלם מההערה.


הערות
הערת HTML נראית כך:
<!-- Note -->
הערת JS לעומת זאת נראית כך:
// A note for all thr line
/* Note to closing */
השני לוכסנים (" // ") הם הערה עד סוף השורה.
הלוכסן כוכבית (" /* ") הוא עד לסגירה (" */ ")


הודעות קופצות
בשביל לעשות הודעה קופצת למשתמש (כמו שיש בפרסומות "אתה הזוכה ב...")
בשביל להכניס הודעה קופצת כגון זאת:


אינטרנט אקספלורר (Internet Explorer)



או בגוגל כרום (Google Chrome)



עלינו לרשום כך:

<script type="text/javascript"><!--window.alert("My First Message!"); //we make a message//--></script><noscript>Your browser does not support JavaScript!</noscript>

מה רשמנו פה?
קודם כל הכרזנו על הסקריפט ובלה בלה בלה.
שימו לב!
לא חובה (אך מומלץ) לרשום קודם את אובייקט החלון, אפשר להגיד שזה:
window.alert("bla"); //we alert bla
שקול לזה:
alert("bla"); //we alert bla
שימו לב לשורה:
window.alert("My First Message!"); //we make a message
היא זאת שעושה את הכל.
זוכרים שאמרתי שיש אובייקטים ולכל אובייקט תכונות?
אז זהו פה התחלנו
קודם כל כתבנו את אובייקט החלון (window) אח"כ כתבנו את הפעולה שצריך לעשות(לעשות הודעה alert) ואז רשמנו מה לעשות.
שים לב!
צריך לשים בסוף כל משפט נקוד פסיק (" ; ") בשביל להראות על סיום הפקודה!




חדי העין שקראו את הפרק הקודם שמו לב שהשתמשתי בהערה

//we make a message

עשיתי זאת רק בגלל אילוצי הצגת המלל, אפשר להוסיף או לא להוסיף הערות זה אתם קובעים זיכרו! כל אחד יכול לראות את ההערות שלכם, אל תשימו שם מידע רגיש! (סיסמאות מידע אישי וכ'ו).
עכשיו תכתבו זאת בתוך קוד ה-HTML.


הודעות קופצות עם בחירה
נכון ראיתם בכמה וכמה אתרים הודעות קופצות עם אפשרות בחירה? (של כן או לא)
עכשיו נלמד לעשות זאת!
בשביל להכניס הודעה קופצת כגון זאת:אינטרנט אקספלורר (Internet Explorer)

או בגוגל כרום (Google Chrome)

בשביל זה נרשום:

if (confirm("Prees Somthing")){alert("You Said Yes");}else{alert("You Said No");}

עכשיו יהיה לכם שאלת בחירה עם ללחוץ "אישור" או "ביטול" אם תלחצו על "אישור" תיהיה לכם הודעה רגילה שתכתוב "You Said Yes"
לעומת זאת אם תבחרו ב-"ביטול"
אתם תקבלו: "You Said No"




הודעות קופצות עם מלל
בשביל להכניס הודעה קופצת כגון זאת:

אינטרנט אקספלורר (Internet Explorer)






או בגוגל כרום (Google Chrome)

נרשום:

var x = prompt("Enter your name: ");            window.document.write("Hello, " + x + " welcome to my site!");

קודם כל רשמנו את ההודעה (Enter your name אחרי שהמשתמש הקליד את השם,
למשל Smoxer הדפדפן ירשום:
Hello, Smoxer welcome to my site!

ש.ב

תתנו לי הודעה קופצת מכל דבר שבכולם רשום "iAtraf.co.il".

[גלוש123]

מדריך מעולה.

[יאיר100]

איזה יופי של מדריך!

[dumbop]

מדריך מצוין תודה

[ItamarMuForce]

וואוווווו אני מתחיל ללמוד ממך אני ממש צריך את זה ! תודה !