Určenie základnej adresy dokumentu s elementom HTML

Webové stránky sú vytvorené sériou odkazov, ukazujú na stránky a zdroje, ako sú obrázky a štýly so štýlmi. Existujú dva spôsoby zadajte adresu URL, ktorá odkazuje na tieto zdroje: buď použiť absolútnu cestu alebo relatívnu cestu.

Absolútna cesta odkazuje na konkrétny cieľ, zvyčajne začína s názvom domény (spolu s HTTP) www.domain.com/destination/source.jpg. Relatívna cesta je naopak: cieľové miesto odkazu závisí od miesta koreňa alebo vo väčšine prípadov od názvu domény vašej webovej lokality.

Typická relatívna cesta by vyzerala takto:

Ak je vaša doména webových stránok napríklad, hongkiat.com cesta k obrázku by vyriešila hongkiat.comimages_2 / zadanie-document-base-url-with-html-base-element.png. Mali by ste to pochopiť, ak ste na chvíľu vyvíjali webové stránky.

Ale väčšina z vás asi pravdepodobne nepočula element. Táto značka HTML bola okolo od HTML4, ale veľmi málo je vidieť jej implementácia vo voľnej prírode. W3C opisuje tento prvok ako:

“Základný prvok umožňuje autorom špecifikovať základná webová adresa dokumentu na účely vyriešenia relatívnych adries URL a názov súboru predvolený kontext prehliadania na účely nasledujúcich hypertextových odkazov.”

toto element určuje základnú adresu URL pre relatívnu cestu na webových stránkach. Namiesto toho, v závislosti od koreňového umiestnenia alebo domény vašich webových stránok, môžete to uviesť niekde inde, napríklad adresu URL, kde sa nachádzajú zdroje v CDN (Content Delivery Network). Pozrime sa, ako to skutočne funguje.

Použitie základného prvku

je definovaná pozdĺž strany a tagy v rámci . Vzhľadom na nasledujúci príklad nastavíme základnú webovú adresu na spoločnosť Google.

Táto špecifikácia bude mať vplyv na všetky cesty v dokumente vrátane tých, ktoré sú špecifikované v rámci dokumentu href atribút a src obrázkov. Takže za predpokladu, že máme súbor štýlov, obrázkov a odkazov v dokumente s relatívnou cestou, ako je napríklad:

  Anchor Link

Aj keď naša webová stránka je pod demo.hongkiat.com relatívna cesta sa bude týkať hongkiat.maxcdn.com, po základnej ceste špecifikovanej v tag. Skúste prejsť nad odkaz a prehliadač vám ukáže, kam smeruje práve cesta.

Všetky relatívne cesty budú nakoniec:

  Anchor Link

Nastavenie cieľa predvoleného odkazu

Okrem definovania základnej adresy URL, značka môže tiež nastaviť predvolený cieľ odkazu cez terč atribútov. Povedzte, že chcete otvoriť všetky odkazy v dokumente v prehliadači nová karta, nastaviť terč s _blank, ako.

obmedzenia

značka obsahuje v niektorých prípadoch niekoľko upozornení:

Po prvé podpora prehliadača je skvelá; funguje v IE6. Ale IE6 si myslí, že to vyžaduje zatvárací prívesok . Mohlo by to spôsobiť hierarchické problémy v dokumente, ak zatvárací tag zostane nešpecifikovaný. Jednoduchým rýchlym riešením tohto problému je pridanie uzavretie v rámci komentára, .

Ak používate # v spojení s na prepojenie s oddielmi v dokumente, môžete potenciálne naraziť na problém v programe Internet Explorer 9. Namiesto preskočenia na uvedenú sekciu aplikácia Internet Explorer 9 znovu načíta stránku.

Okrem toho, prázdne miesto href bude mať za následok, že základná webová adresa namiesto prepojenia s aktuálnym adresárom, na ktorom je stránka umiestnená (to je predvolené správanie prehliadača), čo môže spôsobiť neočakávané problémy s referenciami.

Zabaliť

je praktická funkcia HTML, ktorá môže zjednodušiť odkazovanie odkazov v webovom dokumente. Značku značne používajte na minimalizáciu nástrah. Nasledujte nižšie uvedený odkaz a viac informácií o tag:

Absolútne a relatívne adresy URL - MSDN
Základný prvok HTML - W3C