ציון כתובת אתר של מסמך עם HTML אלמנט

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

הנתיב המוחלט מתייחס ליעד ספציפי, בדרך כלל זה התחיל עם שם התחום (יחד עם HTTP) כמו www.domain.com/destination/source.jpg. הנתיב היחסי הוא ההפך: יעד הקישור תלוי במיקום השורש או ברוב המקרים את שם התחום של האתר שלך.

נתיב יחסי טיפוסי ייראה כך:

אם תחום האתר שלך הוא, לדוגמה, hongkiat.com נתיב התמונה יפתור את הבעיה hongkiat.comimages_2 / specifying-document-base-url-with-html-base-element.png. אתה צריך להבין את זה אם אתה כבר בפיתוח האתר במשך זמן מה.

אבל רובכם כנראה לא שמעתם על אלמנט. תג HTML זה נמצא בסביבה מאז HTML4, אך מעט מאוד נראה של יישומה בטבע. W3C מתאר רכיב זה כ:

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

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

שימוש באלמנט הבסיס

ה מוגדר בצד ו תגים בתוך . בדוגמה הבאה, אנו מגדירים את כתובת האתר הבסיסית ל- Google.

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

  קישור עוגן  

למרות דף האינטרנט שלנו הוא תחת Demo.hongkiat.com נתיב יחסי יתייחס hongkiat.maxcdn.com, בעקבות נתיב הבסיס שצוין תג. נסה להעביר את העכבר מעל הקישור, והדפדפן יציג בפניך את הנתיב המדויק.

כל הנתיבים היחסיים יהיו בסופו של דבר:

  קישור עוגן  

הגדרת היעד קישור ברירת מחדל

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

מגבלות

ה תג, עם זאת, מחזיקה כמה אזהרות בנסיבות מסוימות:

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

אם אתה משתמש # יחד עם כדי לקשר לקטעים בתוך המסמך, ייתכן שתיתקל בבעיה ב- Internet Explorer 9. במקום לקפוץ למקטע המוזכר, Internet Explorer 9 יטען מחדש את הדף.

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

לעטוף

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

• כתובות אתרים מוחלטים יחסית - MSDN
• רכיב HTML HTML - W3C