![]() |
![]() |
![]() ![]()
Post
#1
|
|
Grupa: Zarejestrowani Postów: 196 Pomógł: 0 Dołączył: 9.03.2017 Ostrzeżenie: (0%) ![]() ![]() |
Utworzyłem element "newItem" (<h3>Water</h3>). Chciałbym go wstawić przed każdym bezpośrednim dzieckiem "div.facetwp-facet-tags" z klasą "facetwp-checkbox". Robię więc pętlę forEach, która za pomocą "insertBefore" wkleja ten "newItem" przed każdym "referenceNode", czyli zmiennej "element" w tym przypadku. Czy ten tok myślenia jest dobry? Jeżeli tak, to dlaczego to nie działa? Pojawia się: "TypeError: list.insertBefore is not a function".
https://codepen.io/rudolph-reti/pen/QWbJQJr Kod <div class="facetwp-facet-tags">
<div class="facetwp-checkbox" data-value="arbeit"> Arbeit <span class="facetwp-counter">(4)</span> <span class="facetwp-expand">[+]</span> </div> <div class="facetwp-depth"> <div class="facetwp-checkbox" data-value="arbeitsrecht"> Arbeitsrecht <span class="facetwp-counter">(4)</span> </div> <div class="facetwp-checkbox" data-value="gastronomie"> Gastronomie <span class="facetwp-counter">(4)</span> </div> </div> <div class="facetwp-checkbox" data-value="autarkie"> Autarkie <span class="facetwp-counter">(2)</span> </div> <div class="facetwp-checkbox" data-value="bach-johann-sebastian"> Bach, Johann Sebastian <span class="facetwp-counter">(1)</span> </div> <div class="facetwp-checkbox" data-value="ludwig-van-beethoven"> Beethoven, Ludwig van <span class="facetwp-counter">(1)</span> </div> <div class="facetwp-checkbox" data-value="behinderten"> Behinderten <span class="facetwp-counter">(1)</span> </div> <div class="facetwp-checkbox" data-value="bioinformatik"> Bioinformatik <span class="facetwp-counter">(1)</span> </div> <div class="facetwp-checkbox" data-value="christentum"> Christentum <span class="facetwp-counter">(4)</span> <span class="facetwp-expand">[+]</span> </div> </div> <script> const list = document.querySelectorAll("div.facetwp-facet-tags > div.facetwp-checkbox"); //console.log(list) let newItem = document.createElement("h3"); let textnode = document.createTextNode("Water"); newItem.appendChild(textnode); //console.log(newItem) list.forEach(function(element, index, array) { list.insertBefore(newItem, element); }); </script> Ten post edytował stellatus 26.03.2020, 15:35:35 |
|
|
![]() |
![]()
Post
#2
|
|
Grupa: Zarejestrowani Postów: 196 Pomógł: 0 Dołączył: 9.03.2017 Ostrzeżenie: (0%) ![]() ![]() |
Dzięki. Błąd zniknął, ale to insertBefore nie działa tak jak oczekiwałem. Nie wkleja "newItem" przed każdym elementem listy, tylko przed tym, na którym zatrzymuje się pętla. Co zrobić, żeby wkleić "newItem" przed każdym elementem listy?
Kod const list = document.querySelectorAll("div.facetwp-facet-tags > div.facetwp-checkbox"); //console.log(list) const parent = document.querySelector("div.facetwp-facet-tags"); //console.log(parent) let newItem = document.createElement("h3"); let textnode = document.createTextNode("Water"); newItem.appendChild(textnode); //console.log(newItem.innerHTML) list.forEach(function(element, index, array) { parent.insertBefore(newItem, element); }); |
|
|
![]() ![]() |
![]() |
Aktualny czas: 12.10.2025 - 20:04 |