Splot JavaScript dla tablicy elementów DOM

Question

var myArray = []; 
myArray = document.querySelectorAll('.selected'); 

A kiedy nazwałem myArray.splice - nie było to zdefiniowane. Jak mogę tego uniknąć? Potrzebuję usunąć niektóre elementy DOM z tej tablicy.

Answer 1

Problem polega na tym, że querySelectorAll(..) zwraca listę węzłów (NodeList) - nie jest to standardowa tablica JS.

Może być, że chcesz coś jak poniżej:

Array.prototype.slice.call(document.querySelectorAll('.selected'), <begin>, <end>); 

---

UPDATE

brakowało mi część, gdzie próbujesz usunąć, dzięki @torazaburo. Na szczęście można bezpośrednio zastosować filtr na NodeList zamiast przechodzić przez konwersję tablicy. Coś jak poniżej:

var arrayOfNodes = [].filter.call(document.querySelectorAll(".selected"), function(curNodeItem) { 
    return shouldCurrentNodeBeRetained(curNodeItem)? true : false; 
    //expanded for clarity.  
}); 

Answer 2

querySelectorAll jest NodeListarray-like collection, ale to nie jest tablicą, ponieważ nie dziedziczą Array.prototype. Aby przekonwertować go do prawdziwej tablicy należy użyć slice ten sposób:

var myArray = [].slice.call(document.querySelectorAll('.selected')); 

Istnieje możliwość korzystania slice tak ze względu na fakt, że Array.prototype.slice celowo sposób ogólny, co oznacza, że ​​jest to realizacja wewnętrzny nie sprawdza czy this wartość jest rzeczywiście instancją Array. Tak więc slice może być używany z dowolnymi obiektami podobnymi do tablic, posiadającymi indeksy liczbowe i własność length.

Answer 3

document.querySelectorAll zwraca wartość NodeList, a nie tablicę.

W związku z tym nie ma metody Splice na NodeList Domyślnie.

Jednak można prototypować podobną metodę dla listy węzłów A.

Tutaj działa JSFiddle, usuwa elementy takie jak splice bezpośrednio z DOM, możesz je modyfikować w dowolny sposób.

var myArray = []; 
myArray = document.querySelectorAll('.selected'); 

//This is a primitive analogue of splice without adding new elements, it will not remove element from NodeList, however will remove it directly from dome, then it will return the resulting array (As Array), because NodeList is unmodifiable; 
NodeList.prototype.splice = function(pos, numToRemove){ 
    var initRemCount = remCount = numToRemove ? numToRemove : 1; 
    var removed = []; 
    for(var i = 0; i < this.length; i++){ 
     if(!remCount) 
      break; 
     var elm = this[i]; 
     if(i >= pos){ 
      //elm.parentElement.removeChild(elm); //I commented this out, 'cause you say you dont want to delete members from DOM, uncomment this to do so 
      remCount--; 
     } 
    } 
    return [].slice.call(this, pos, pos + initRemCount); 
} 

var resultArray = myArray.splice(2, 2); 

//This is the Araay already not a NodeList 
console.log(resultArray);