Ghép Javascript cho mảng các phần tử DOM

Question

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

Và khi tôi gọi myArray.splice - nó không được xác định. Làm thế nào tôi có thể tránh điều này? Tôi cần loại bỏ một số phần tử DOM khỏi mảng đó.

Answer 1

Sự cố là querySelectorAll(..) trả về danh sách các nút (NodeList) - không phải là mảng JS chuẩn.

Có thể bạn muốn một cái gì đó như dưới đây:

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

---

CẬP NHẬT

tôi đã bỏ lỡ phần mà bạn đang cố gắng để xóa, nhờ @torazaburo. May mắn thay, bạn có thể trực tiếp áp dụng bộ lọc trên NodeList thay vì đi qua một chuyển đổi mảng. Một cái gì đó như dưới đây:

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

Answer 2

querySelectorAll là một NodeListarray-like collection, nhưng nó không phải là một mảng, vì nó không kế thừa từ Array.prototype. Để chuyển nó sang mảng thực bạn sẽ sử dụng slice theo cách này:

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

Có thể sử dụng slice như thế này do thực tế rằng Array.prototype.slice là cố ý phương pháp chung, có nghĩa là nó thực hiện nội không kiểm tra nếu this giá trị thực tế là Array. Vì vậy, slice có thể được sử dụng với bất kỳ đối tượng mảng nào, có chỉ mục số và thuộc tính length.

Answer 3

document.querySelectorAll trả về một NodeList, không phải là một mảng.

Do đó không có phương pháp Splice trên NodeList Theo mặc định.

Tuy nhiên bạn có thể thử nghiệm phương pháp tương tự cho danh sách nút.

Đây là một hoạt động JSFiddle, nó loại bỏ các phần tử như mối nối trực tiếp từ DOM, bạn có thể sửa đổi nó theo bất kỳ cách nào bạn muốn.

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);