Dodanie wrappera przy pomocy insertAdjacentHTML afterbegin beforeend działa dziwnie

0

Dlaczego poniższy kod dodaje domknięcie wrappera zaraz po jego otwarciu zamiast tak jak wskazuje beforeend przed domknięciem containera?

https://jsfiddle.net/bwq3pkm2/1/

1
mmx napisał(a):

Dlaczego poniższy kod dodaje domknięcie wrappera zaraz po jego otwarciu zamiast tak jak wskazuje beforeend przed domknięciem containera?

https://jsfiddle.net/bwq3pkm2/1/

insertAdjacentHTML() parsuje to co podałeś jako HTML, czyli do <div class="wrapper"> sam dorzuca zamykający div.
Natomiast nie możesz wsadzić samego zamykającego div. Parser nie wie jak to interpretować.
Tej linijki el[0].insertAdjacentHTML('beforeend', wrap_close); równie dobrze mogłoby nie być.

Tobie chyba chodzi o coś takiego: https://jsfiddle.net/swbzon1x/ Zrobione na szybko i brutalnie. Bardziej finezyjnie można by się bawić, w createElement i appendChild. No ale nie wiem czego potrzebujesz

1

Nieco bardziej eleganckie rozwiązanie:

var el = document.querySelectorAll('.container');
var wrapper = document.createElement('div');
wrapper.classList.add("wrapper");
var length = el[0].childNodes.length;
for(var i=0;i<length;i++) {
    wrapper.appendChild(el[0].childNodes[0]);
}
el[0].appendChild(wrapper);

1 użytkowników online, w tym zalogowanych: 0, gości: 1