importurile de înglobare html-HTML5 fișier într-un alt fișier HTML-
HTML5 Importurile: codul HTML de încorporat-fișier într-un alt fisier HTML
Încorporarea HTML-fișier într-un alt fisier HTML
Browser-ul Suport
Din păcate, suport pentru HTML5 browsere Importurile sunt încă foarte limitate. Punerea în aplicare a acestei tehnologii noi și interesante a fost demonstrată pentru prima dată în versiunea 31-lea a Google Chrome, în această versiune, a fost necesar să se includă importurile HTML5 manual. Pentru a face acest lucru, trebuia să deschidă un chrome: // flags (Chrome experimental este posibil), rotiți steagul "Enable Imports HTML". și apoi reporniți Chrome.
Dar acum vei fi foarte fericit să știu că Chrome 36 are suport pentru importuri HTML5. Acest lucru înseamnă că nu mai este nevoie să vă faceți griji cu privire la modul de a activa manual această funcție.
În plus, pentru a determina dacă suportul de browser pentru HTML5 Importurile sau nu, puteți utiliza de mai jos:
dacă # 40; „Import“ în documentul. createElement # 40; "Link" # 41; # 41; # 123;
// Acest browser suportă HTML5 Importuri.
# 125;
Pentru alte browsere care nu acceptă HTML5 Importurile, puteți utiliza Polyfill Polimer lui.
Utilizarea Importurile HTML5
Acesta utilizează elementul HTML5 Importurile . pentru a specifica calea către fișierul pe care doriți să îl încărcați, precum și noi de import, script-uri și foi de stil în documentul HTML.
Pentru importuri, tot ce trebuie să faceți este să înlocuiți valoarea atributului rel la „import“. Când setați atributul rel = „de import“. Acest lucru spune browser-ul pe care doriți să importați fișierul specificat în document.
Notă: Dacă doriți să descărcați documentul HTML cu un alt domeniu, trebuie să vă asigurați că importul este permis CORS.
Obținerea de conținut
var doc = documentul. querySelector # 40; 'Link [rel = "import"]' # 41;. import;
El va apuca întregul conținut doc.html fișier pe care il importam in pagina noastra web. Element de proprietate link-ul de import este nul. în cazul în care:
- CORS resurse dezactivate.
- Are rel = "de import".
- HTML5 Importurile nu este acceptată în browser.
- un articol Acesta a fost scos din DOM, sau nu a fost adăugat la DOM.
Să presupunem, doc.html conține:
concluzie
Datorită HTML5 Importă puteți crea piese reutilizabile de cod pe care le puteți adăuga o linie simplă de cod, și anume, . Aceasta este o tehnologie extrem de puternic se va schimba complet lumea de dezvoltare web în viitor.