שיעור 8: קישורים
בשיעור זה, תלמד כיצד ליצור קישור בין דפים.
מה אני צריך כדי ליצור קישור?
כדי ליצור קישור, אתה משתמש במה שתמיד תשתמש בו בקוד HTML: אלמנט. אלמנט פשוט עם מאפיין יחיד ותוכל ליצור קישור לכל דבר. הנה דוגמה איך קישור לאתר שלנו HTML.net יכול להיראות:
דוגמה 1:
<a href="http://www.html.net/">HTML.net הנה קישור לאתר</a>
בדפדפן זה יראה כך:
האלמנט a מייצג עוגן-"anchor". והמאפיין href הוא קיצור של "hypertext reference", שמתאר לאן הקישור מוביל - בדרך כלל כתובת באינטרנט או שם קובץ.
בדוגמה למעלה למאפיין href יש את הערך "http://www.html.net", שהוא הכתובת המלאה לאתר HTML.net ונקרא Uniform Resource Locator) URL). שים לב ש-"//:http" חייב תמיד להיכלל בכתובת של אתרי אינטרנט. המשפט "הנה קישור לאתר HTML.net" הוא הטקסט שמוצג בדפדפן כקישור. זכור לסגור את האלמנט עם התג <a/>.
מה לגבי קישורים בין הדפים שלי?
אם אתה רוצה ליצור קישור בין דפים באותו אתר אינטרנט, אתה לא צריך לציין את כל הכתובת (URL) למסמך. למשל, אם יצרתה שני דפים (בוא ונקרא להם page1.htm ו-page2.htm) ואתה שומר אותם באותה ספריה, אתה יכול ליצור קישור מדף אחד לדף שני פשוט על ידי כתיבת שם הקובץ בקישור. בנסיבות אלו קישור מדף page1.htm ל-page2.htm יראה כך:
דוגמה 2:
<a href="page2.htm">הקש כאן כדי לעבור לדף 2</a>
אם דף 2 ממוקם בספריית משנה (subfolder), הקישור יכול להראות כך:
דוגמה 3:
<a href="subfolder/page2.htm">הקש כאן כדי לעבור לדף 2</a>
בכיוון ההפוך, קישור מדף 2 שממוקם בספריית המשנה לדף 1 יראה כך:
דוגמה 4:
<a href="../page1.htm">קישור לדף 1</a>
"/.." מצביע לספרייה הממוקמת רמה אחת מעל למקום בו ממוקם הקובץ ממנו הקישור נוצר. על פי אותו עיקרון, אתה יכול להצביע גם לשתי רמות ויותר בצורה כזו "/../..".
האם הבנתה את העיקרון? לחילופין, אתה תמיד יכול לכתוב את הכתובת המלאה לקובץ (URL).
מה לגבי קישור פנימי בתוך הדף?
אתה גם יכול ליצור קישור פנימי בתוך הדף - למשל תוכן עניינים בראש הדף עם קישור לכל פרק שמתחת. כל שאתה צריך זה להשתמש במאפיין שימושי ביותר שנקרא identification) id) ובסמל "#".
השתמש במאפיין id לסימון האלמנט אליו אתה רוצה לקשר. לדוגמה:
<h1 id="heading1">כותרת 1</h1>
עכשיו אתה יכול ליצור קישור לאלמנט זה באמצעות "#" במאפייני הקישור. לסמל "#" חייבים להוסיף את המזהה id של התג אליו אתה רוצה לקשר. לדוגמה:
<a href="#heading1">קישור לכותרת 1</a>
הכל יובן עם דוגמה:
דוגמה 5:
<html>
<head>
</head>
<body>
<p><a href="#heading1">קישור לכותרת 1</a></p>
<p><a href="#heading2">קישור לכותרת 2</a></p>
<h1 id="heading1">כותרת 1</h1>
<p>טקסט טקסט טקסט טקסט</p>
<h1 id="heading2">כותרת 2</h1>
<p>טקסט טקסט טקסט טקסט</p>
</body>
</html>
בדפדפן זה יראה כך (הקש על שני הקישורים):
(שים לב: המאפיין id חייב להתחיל עם אות)
האם אני יכול לקשר למשהו אחר?
כן, אתה יכול ליצור גם קישור לכתובת דואר אלקטרוני. זה נעשה כמעט באותו אופן שאתה מקשר למסמך:
דוגמה 6:
<%
If Instr(LCase(Request.Servervariables("HTTP_USER_AGENT")),"msie 7") Then
%>
<a href="mailto:nobody@html.net">Send an e-mail
to nobody at HTML.net</a>
<%
Else
%>
<a href="mailto:nobody@html.net">Send an e-mail to nobody at HTML.net</a>
<%
End If
%>
בדפדפן זה יראה כך:
ההבדל היחיד בין קישור לדואר אלקטרוני וקישור לקובץ הוא שבמקום לכתוב כתובת של מסמך, אתה כותב :mailto ולאחריו את כתובת הדואר האלקטרוני. כשמקישים על הקישור, תוכנת הדואר המוגדרת כברירת מחדל במחשב שלך תפתח במצב כתיבה של הודעת דואר חדשה והכתובת תופיע בתיבה "אל". שים לב שתכונה זו תפעל רק אם יש תוכנת דואר אלקטרוני המתוקנת במחשב שלך. נסה זאת!.
האם יש מאפיינים נוספים שעלי לדעת עליהם?
כדי ליצור קישור, אתה צריך להשתמש תמיד במאפיין href. בנוסף, אתה יכול גם לשים title בקישור שלך:
דוגמה 7:
<%
If Instr(LCase(Request.Servervariables("HTTP_USER_AGENT")),"msie 7") Then
%>
<a href="http://www.html.net/" title="Visit HTML.net and learn HTML">HTML.net</a>
<%
Else
%>
<a href="http://www.html.net/" title="Visit HTML.net and learn HTML">HTML.net</a>
<%
End If
%>
בדפדפן זה יראה כך:
המאפיין title משמש לכתיבת תיאור קצר על מהות הקישור. אם תמקם את סמן העכבר מעל לקישור בלי להקיש עליו, תראה את ההודעה שתופיע "בקר באתר HTML.net ולמד HTML".