Asiakirjan perustavan URL-osoitteen määrittäminen HTML -elementillä

Verkkosivustot on rakennettu useilla linkeillä, jotka osoittavat sivuja ja lähteitä, kuten kuvia ja tyylitaulukoita. On kaksi tapaa määritä URL, joka linkittää näihin lähteisiin: joko käytä absoluuttista polkua tai suhteellista polkua.

Absoluuttinen polku viittaa tiettyyn kohteeseen, tyypillisesti se aloitetaan verkkotunnuksella (kuten HTTP: llä) www.domain.com/destination/source.jpg. Suhteellinen polku on päinvastainen: linkin kohde riippuu juuripaikasta tai useimmiten verkkosivustosi verkkotunnuksesta.

Tyypillinen suhteellinen polku näyttää seuraavalta:

Jos sivustosi verkkotunnus on esimerkiksi, hongkiat.com kuva polku ratkaisee hongkiat.comimages_2 / määritellään-asiakirja-base-url-with-html-base-element.png. Sinun pitäisi ymmärtää tämä, jos olet kehittänyt verkkosivustoa jonkin aikaa.

Mutta useimmat teistä eivät todennäköisesti ole kuulleet elementti. Tämä HTML-tunniste on ollut käytössä HTML4: n jälkeen, mutta sen toteuttaminen luonnossa on hyvin pieni. W3C kuvaa tätä elementtiä seuraavasti:

“Pohjaelementti antaa tekijöille mahdollisuuden määrittää asiakirjan perus URL-osoite suhteellisten URL-osoitteiden ja nimien ratkaisemiseksi oletusselainyhteys hyperlinkkien seuraamiseksi.”

Tämä elementti päättää pohjimmiltaan URL-osoitteen suhteellisen polun Web-sivuilta. Sen sijaan, että olisit riippuvainen sivuston sijainnista tai verkkotunnuksesta, voit osoittaa sen muualle, ehkä URL-osoitteeseen, jossa resurssit sijaitsevat CDN: ssä (Content Delivery Network). Katsotaanpa, miten se todella toimii.

Pohjaelementin käyttäminen

on määritelty rinnakkain ja tunnisteita . Seuraavan esimerkin perusteella asetamme Googlen perus URL-osoitteen.

Tämä määritys vaikuttaa kaikkiin asiakirjan polkuihin, mukaan lukien sellainen, joka on määritetty href määrite ja src kuvista. Eli olettaen, että dokumenttikokonaisuudessa on tyylitaulukko, kuvat ja linkit, joilla on tällainen suhteellinen polku, esimerkiksi:

  Ankkurilinkki  

Vaikka verkkosivumme on alle demo.hongkiat.com suhteellinen polku viittaa hongkiat.maxcdn.com, seurataan kohdassa tag. Yritä siirtyä linkin yli, ja selain näyttää, missä polku on tarkalleen.

Kaikki suhteelliset polut ovat lopulta:

  Ankkurilinkki  

Oletuslinkin tavoitteen asettaminen

Sen lisäksi, että määritetään perus-URL-osoite, tunniste voi myös asettaa oletusyhteyden kohteen kohde ominaisuus. Sano, että haluat avata asiakirjan kaikki linkit selaimen uudessa välilehdessä, aseta kohde kanssa _tyhjä, niin kuin.

rajoitukset

tunnisteella on kuitenkin muutama huomautus joissakin tilanteissa:

Ensinnäkin selaimen tuki on suuri; se toimii IE6: ssa. Mutta IE6: n mielestä se vaatii sulkumerkin . Tämä saattaa aiheuttaa asiakirjassa hierarkian ongelman, jos sulkumerkintä jätetään määrittämättä. Yksinkertainen nopea tapa käsitellä tätä ongelmaa on lisätä suljetaan kommentin sisällä, .

Jos käytät # yhdessä Jos haluat linkittää asiakirjan osiin, Internet Explorer 9: ssä saattaa esiintyä ongelma. Sen sijaan, että siirryit mainittuun osaan, Internet Explorer 9 lataa sivun uudelleen.

Lisäksi tyhjä href johtaa URL-osoitteeseen sen sijaan, että linkitettäisiin nykyiseen hakemistoon, jossa sivu sijaitsee (tämä on oletusselainkäyttäjä), joka voi aiheuttaa odottamattomia viittausongelmia.

Paketoida

on kätevä HTML-ominaisuus, joka voi yksinkertaistaa linkkien viittausta web-asiakirjassa. Käytä tagia tarkasti, jotta minimoidaan epäonnistumiset. Noudata alla olevia ohjeita, jos haluat lisätietoja tag:

• Absoluuttiset ja suhteelliset URL-osoitteet - MSDN
• HTML Base Element - W3C