Specificarea adresei de bază a documentului cu element HTML

Site-urile web sunt construite cu o serie de link-uri, îndreptate către pagini și surse precum imagini și foi de stiluri. Există două modalități specificați adresa URL care leagă aceste surse: fie utilizați o cale absolută sau o cale relativă.

Calea absolută se referă la o destinație specifică, de obicei a început cu numele de domeniu (împreună cu HTTP) www.domain.com/destination/source.jpg. Calea relativă este opusul: destinația link-ului depinde de locația rădăcinii sau, în majoritatea cazurilor, de numele de domeniu al site-ului dvs. Web.

O cale relativă tipică ar arăta astfel:

Dacă domeniul dvs. de site este, de exemplu, hongkiat.com calea imaginii ar rezolva problema hongkiat.comimages_2 / specificând document-base-url-cu-html-base-element.png. Ar trebui să înțelegeți acest lucru dacă ați dezvoltat site-ul pentru o vreme.

Dar majoritatea probabil că nu ați auzit despre element. Această etichetă HTML a fost în jurul valorii de la HTML4, dar foarte puțin se vede de la punerea ei în aplicare în sălbăticie. W3C descrie acest element ca:

“Elementul de bază permite autorilor să specifice adresa URL a bazei de documente în scopul de a rezolva URL-uri relative, și numele de contextul de navigare implicit în scopul urmăririi hiperlinkurilor.”

Acest elementul decide în principiu adresa URL de bază pentru calea relativă în paginile web. În loc de a depinde de locația rădăcinilor sau de domeniul site-ului dvs. web, puteți să-l îndreptați spre altundeva, poate la fel ca și adresa URL în care se află resursele dvs. în CDN (Content Delivery Network). Să vedem cum funcționează de fapt.

Utilizarea Elementului de bază

este definită de-a lungul laturii și etichete în cadrul . Având în vedere următorul exemplu, am setat adresa URL de bază la Google.

Această specificație va afecta toate căile din document, inclusiv una specificată în cadrul documentului href atributul și src a imaginilor. Deci, presupunând că avem o foaie de stil, imagini și linkuri în documentul setat cu o cale relativă ca aceasta, de exemplu:

  Anchor Link

Chiar dacă pagina noastră web este sub demo.hongkiat.com calea relativă se va referi la hongkiat.maxcdn.com, urmând calea de bază specificată în etichetă. Încercați să treceți peste link și browserul vă va arăta unde se îndreaptă calea.

Toate căile relative vor fi în cele din urmă:

  Anchor Link

Setarea destinației de conectare implicită

În afară de definirea adresei URL de bază, tagul poate seta, de asemenea, tinta de link implicit prin ţintă atribut. Spuneți că doriți să deschideți toate link-urile din document în fila browser nou, Seteaza ţintă cu _gol, ca astfel.

limitări

tag, cu toate acestea, deține câteva restricții în anumite circumstanțe:

În primul rând, suportul pentru browser este minunat; funcționează în IE6. Dar, IE6 crede că necesită o etichetă de închidere . Aceasta ar putea cauza o problemă de ierarhie în document, dacă eticheta de închidere este lăsată nespecificată. O modalitate simplă rapidă de a aborda această problemă este prin adăugarea închiderea în cadrul unui comentariu, .

Dacă utilizați # împreună cu pentru a vă conecta la secțiunile din document, este posibil să întâmpinați o problemă în Internet Explorer 9. În loc să faceți salt la secțiunea menționată, Internet Explorer 9 va reîncărca pagina.

Mai mult, un semnal necompletat href va duce la adresa URL de bază în loc să se conecteze la directorul curent în care se află pagina (acesta este un comportament implicit al browserului), ceea ce ar putea cauza probleme de referință neașteptate.

Învelire

este o funcție HTML utilă, care poate simplifica trimiterea de referințe într-un document web. Utilizați eticheta în mod considerabil pentru a reduce la minimum capcanele. Urmați aceste referințe de mai jos pentru mai multe informații despre etichetă:

Adresele absolute și relative - MSDN
Elementul de bază HTML - W3C