Recimo da imate HTML koji je niz:
let string_of_html = ` Cool `;Možda dolazi iz API-ja ili ste ga sami konstruirali iz literalnih predložaka ili slično.
Možete innerHTMLto staviti u element, poput:
document.body.innerHTML = string_of_html; // Append it instead document.body.innerHTML += string_of_html;Imate malo više kontrole ako koristite insertAdjacentHTMLfunkciju jer možete postaviti novi HTML na četiri različita mjesta:
text inside node Koristite ga kao ...
el.insertAdjacentHTML('beforebegin', string_of_html); el.insertAdjacentHTML('afterbegin', string_of_html); el.insertAdjacentHTML('beforeend', string_of_html); el.insertAdjacentHTML('afterend', string_of_html);Postoje okolnosti u kojima biste možda htjeli da novostvoreni DOM ostane u JavaScript-u prije nego što bilo što učinite s njim. U tom biste slučaju mogli prvo raščlaniti svoj niz, poput:
let dom = new DOMParser() .parseFromString(string_of_html, 'text/html');To će vam dati potpuni DOM, pa ćete tada trebati izvući dijete koje ste dodali. Pod pretpostavkom da ima samo jedan nadređeni element, to je kao ...
let dom = new DOMParser() .parseFromString(string_of_html, 'text/html'); let new_element = dom.body.firstElementChild;Sad se po tome možete petljati new_element, pretpostavljam prije nego što napravite što trebate s tim.
Ipak je malo jednostavnije to učiniti:
let new_element = document.createRange() .createContextualFragment(string_of_html);Dobit ćete element izravno kao fragment dokumenta koji ćete dodati ili prema potrebi. Ova je metoda značajna po tome što će zapravo izvršiti ono što nađe u njoj, što može biti i korisno i opasno.
U svemu tome postoji znatna količina nijansi. Na primjer, HTML mora biti valjan. Neispravni HTML jednostavno neće uspjeti. Malformed vas također može iznenaditi, poput stavljanja a
Koen Schaft napisao je "Stvorite DOM čvor iz HTML niza" koji pokriva ono što imamo ovdje, ali detaljnije i s više poteškoća.
neće uspjeti jer mu nedostaje a. #####