JavaScript/שילוב במסמך HTML: הבדלים בין גרסאות בדף
שימוש ב syntaxhighlight lang="javascript" |
עוד שימוש ב <syntaxhighlight> |
||
שורה 4: | שורה 4: | ||
<syntaxhighlight lang="javascript"> |
<syntaxhighlight lang="javascript"> |
||
<script type="text/javascript"> |
<script type="text/javascript"> |
||
... |
... javascript קוד |
||
</script> |
</script> |
||
</syntaxhighlight> |
</syntaxhighlight> |
||
שורה 24: | שורה 24: | ||
== תמיכה בדפדפנים ישנים == |
== תמיכה בדפדפנים ישנים == |
||
ניתן לשלב Javascript בתוך קובץ ה-HTML עצמו |
ניתן לשלב Javascript בתוך קובץ ה-HTML עצמו עם |
||
<syntaxhighlight lang="javascript"> |
<syntaxhighlight lang="javascript"> |
||
<script type="text/javascript"> |
<script type="text/javascript"> |
||
... |
... javascript קוד |
||
</script> |
</script> |
||
</syntaxhighlight> |
</syntaxhighlight> |
||
, אך אז אנו נתקלים במספר בעיות. |
|||
דפדפנים ישנים, עלולים לא להכיר את האלמנט script ולכן עלינו להסתיר את תוכן הקוד בהערות HTML |
דפדפנים ישנים, עלולים לא להכיר את האלמנט script ולכן עלינו להסתיר את תוכן הקוד בהערות HTML |
||
<syntaxhighlight lang="javascript"> |
<syntaxhighlight lang="javascript"> |
||
<script type="text/javascript"> |
<script type="text/javascript"> |
||
<!-- |
<!-- |
||
... |
... javascript קוד |
||
--> |
--> |
||
</script> |
</script> |
||
</syntaxhighlight> |
</syntaxhighlight> |
||
⚫ | |||
⚫ | |||
'''לא נכון''' |
'''לא נכון''' |
||
<syntaxhighlight lang="javascript"> |
|||
<pre style="direction:ltr;"> |
|||
<script type="text/javascript"> |
<script type="text/javascript"> |
||
<!-- |
<!-- |
||
שורה 48: | שורה 48: | ||
--> |
--> |
||
</script> |
</script> |
||
</syntaxhighlight> |
|||
</pre> |
|||
'''נכון''' |
'''נכון''' |
||
<syntaxhighlight lang="javascript"> |
|||
<pre style="direction:ltr;"> |
|||
<script type="text/javascript"> |
<script type="text/javascript"> |
||
<!-- |
<!-- |
||
שורה 57: | שורה 57: | ||
--> |
--> |
||
</script> |
</script> |
||
</syntaxhighlight> |
|||
</pre> |
|||
די מסורבל לא? זה בגלל שהתוכן של אלמנט script מוגדר כ-PCDATA (Parsed Content Data). ה-Parsed רוצה לומר שהוא מפרש את התוכן שבתוך ה-script קודם כל כ-HTML ורק אחר-כך כ-Javascript. |
די מסורבל לא? זה בגלל שהתוכן של אלמנט script מוגדר כ-PCDATA (Parsed Content Data). ה-Parsed רוצה לומר שהוא מפרש את התוכן שבתוך ה-script קודם כל כ-HTML ורק אחר-כך כ-Javascript. |
||
שורה 64: | שורה 64: | ||
'''נכון''' |
'''נכון''' |
||
<syntaxhighlight lang="javascript"> |
|||
<pre style="direction:ltr;"> |
|||
<script type="text/javascript"> |
<script type="text/javascript"> |
||
<!-- |
<!-- |
||
שורה 72: | שורה 72: | ||
--> |
--> |
||
</script> |
</script> |
||
</syntaxhighlight> |
|||
</pre> |
|||
כעת ניתן לכתוב רגיל. די מסובך לא? עדיף לשים את הקוד בקובץ אחר ולהיפטר מכל הסיבוך הזה... |
כעת ניתן לכתוב רגיל. די מסובך לא? עדיף לשים את הקוד בקובץ אחר ולהיפטר מכל הסיבוך הזה... |
גרסה מ־02:17, 23 בדצמבר 2017
JavaScript |
---|
התחלת העבודה הוראת תנאי אובייקטים מערכים לולאות
פונקציות אובייקט המסמך אוביקטים נוספים JavaScript למתקדמים ספריות בינה מלאכותית |
על מנת לשלב Javascript בדף ה-HTML שלנו אנחנו צריכים להשתמש באלמנט script של HTML.
- ניתן לכתוב קוד JavaScript בתוך מסמך HTML, תהליך זה בעייתי לדפדפנים ישנים. ולכן אם יש לכם דפדפן חדש (החל מ-Internet Explorer 5 או Firefox 2 או גרסאות חדשות של דפדפנים אחרים) אתם יכולים לכתוב פשוט (בזמן הלמידה):
<script type="text/javascript">
... javascript קוד
</script>
תעברו לפרק הבא ותנסו...
- ניתן להפריד את קוד ה-JavaScript מקוד HTML:
לכתוב את הקוד הבא בין תגי head או body במסמך HTML.
<script type="text/javascript" src="javascript_file.js"></script>
חובה להשתמש באלמנט סוגר, למרות שאין לאלמנט תוכן. בדוגמא זו אנו פותחים קובץ חדש בשם (משהו.js סיומת נקודה-js לקובץ, כמו שלעמוד HTML יש סיומת נקודה-html או נקודה-htm) javascript_file.js, וכותבים בו קוד של javascript. בתוכן הקובץ מושמט ה- <"script type="javascript> ו- <script/> בגלל שאנחנו כבר לא בקובץ ה html שמיבא את הקובץ החדש. דוגמא לקובץ החדש:
<!--
alert("Message")
-->
הערה ליודעי CSS: הפרדה זו דומה להפרדת עיצוב מתוכן בעזרת אלמנט link שקורא ל-CSS, כך נוכל להשתמש באלמנט script על מנת לקרוא לקובץ Javascript, בלי שב-HTML שלנו תהיה שורת קוד Javascript אחת.
תמיכה בדפדפנים ישנים
ניתן לשלב Javascript בתוך קובץ ה-HTML עצמו עם
<script type="text/javascript">
... javascript קוד
</script>
, אך אז אנו נתקלים במספר בעיות. דפדפנים ישנים, עלולים לא להכיר את האלמנט script ולכן עלינו להסתיר את תוכן הקוד בהערות HTML
<script type="text/javascript">
<!--
... javascript קוד
-->
</script>
. כאן לא תמו צרותינו. זוכרים שב-HTML אסור להשתמש במרכאות (") רגילות או כפולות, אלא להשתמש ביישויות בלבד? זה נכון גם כאן.
לא נכון
<script type="text/javascript">
<!--
alert("Message")
-->
</script>
נכון
<script type="text/javascript">
<!--
alert(&quot;Message&quot;)
-->
</script>
די מסורבל לא? זה בגלל שהתוכן של אלמנט script מוגדר כ-PCDATA (Parsed Content Data). ה-Parsed רוצה לומר שהוא מפרש את התוכן שבתוך ה-script קודם כל כ-HTML ורק אחר-כך כ-Javascript.
על מנת להימנע מזה, ניתן לומר לדפדפן שלא יפרש את התוכן כ-PCDATA אלא כ-CDATA. ב-CDATA מרכאות וסימני גדול קטן >< אינם מפוענחים כ-HTML.
נכון
<script type="text/javascript">
<!--
<![CDATA[
alert("Message")
>]]
-->
</script>
כעת ניתן לכתוב רגיל. די מסובך לא? עדיף לשים את הקוד בקובץ אחר ולהיפטר מכל הסיבוך הזה...