Рецимо да имате неки ХТМЛ који је низ:
let string_of_html = ` Cool `;Можда потиче из АПИ-ја или сте га сами конструисали из литералних образаца или слично.
То можете користити innerHTMLда ставите у елемент, попут:
document.body.innerHTML = string_of_html; // Append it instead document.body.innerHTML += string_of_html;Имате мало већу контролу ако користите insertAdjacentHTMLфункцију јер можете поставити нови ХТМЛ на четири различита места:
text inside node Користите га као ...
el.insertAdjacentHTML('beforebegin', string_of_html); el.insertAdjacentHTML('afterbegin', string_of_html); el.insertAdjacentHTML('beforeend', string_of_html); el.insertAdjacentHTML('afterend', string_of_html);Постоје околности у којима бисте можда желели да новостворени ДОМ и даље буде у ЈаваСцрипт-у пре него што било шта учините са њим. У том случају, прво можете да рашчланите низ, на пример:
let dom = new DOMParser() .parseFromString(string_of_html, 'text/html');То ће вам дати потпуни ДОМ, па ћете онда морати да извучете дете које сте додали. Под претпоставком да има само један надређени елемент, то је као ...
let dom = new DOMParser() .parseFromString(string_of_html, 'text/html'); let new_element = dom.body.firstElementChild;Сада се по томе можете петљати new_element, претпостављам пре него што урадите шта требате с тим.
Ипак је мало једноставније то учинити:
let new_element = document.createRange() .createContextualFragment(string_of_html);Елемент ћете добити директно као фрагмент документа за додавање или шта год је потребно. Овај метод је запажен тиме што ће заправо извршити оно што нађе у њему, што може бити и корисно и опасно.
У свему овоме постоји поприлична нијанса. На пример, ХТМЛ мора бити важећи. Неисправни ХТМЛ једноставно неће успети. Малформисани такође могу да вас изненаде, попут стављања а
Коен Сцхафт је написао „Створите ДОМ чвор из ХТМЛ низа“ који покрива оно што имамо овде, али детаљније и са више потешкоћа.
неће успети јер му недостаје а. #####