querySelectorAll kullanılarak getirilen öğeler nasıl kaldırılır?

Question

onun hızlı bir cevabı olan bir şey gibi görünüyor, ama bir tane bulamıyorum. Belki yanlış terimleri araştırıyorum? Hiçbir kütüphane, tarayıcılar arası geri dönüşlere ihtiyaç duymama rağmen, bu projedeki en yeni sürümleri hedefliyorum.

bazı unsurları alıyorum:

element = document.querySelectorAll(".someselector"); 

Yey!

Bu öğeleri nasıl silerim? Neyi kaçırıyorum? Onlarla döngü yapmak ve element.parentNode.removeChild(element); şeyi mi yapmak zorundayım yoksa eksik bir işlev var mı?

Answer 1

Evet, neredeyse haklısınız. .querySelectorAll, dondurulmuş NodeList'u döndürür. Yinelemen ve bir şeyler yapmalısın.

Array.prototype.forEach.call(element, function(node) { 
    node.parentNode.removeChild(node); 
}); 

yalnızca bir sonuç var olsa bile, bunun yerine .querySelector kullanmak, sadece bir element için sorgulamak istiyorsanız

elements[0].parentNode.removeChild(elements[0]); 

---

gibi, endeks üzerinden erişmek gerekir . Orada bir endeksle erişmeye gerek kalmadan sadece düğüm referansı'u alırsınız. NodeList yana

Answer 2

zaten forEach sadece NodeList.prototype.forEach() Bkz

document.querySelectorAll(".someselector").forEach(e => e.parentNode.removeChild(e));

<div> 
 
    <span class="someselector">1</span> 
 
    <span class="someselector">2</span> 
 
    Should be empty 
 
</div>

kullanabilirsiniz destekler. Internet Explorer'ın desteklenmediğini unutmayın.

Düzenleme: Internet Explorer desteği. Ayrıca IE çalışan yukarıdaki kodu yapmak istiyorsanız, sadece JS yerde önce Bu kod parçasını ekleyin: IE

if (!NodeList.prototype.forEach && Array.prototype.forEach) { 
    NodeList.prototype.forEach = Array.prototype.forEach; 
} 

..ve NodeList aniden yanı forEach destekleyecektir.