array.splice() gives error TypeError: arr.splice is not a function(…)

Question

var arr = document.querySelectorAll("a[href*='somestring']")

Returns what looks like an array in the console. Square braces [] and arr.length = 7.

Screen below. Why won't splice() work on my array?

Answer 1

The object returned from querySelectorAll is a NodeList , which is Array- like , yet not an actual array.

Try this to convert to an array:

[].slice.call(document.querySelectorAll("a[href*='somestring']"));

https://developer.mozilla.org/en-US/docs/Web/API/NodeList

Answer 2

HTMLCollection and NodeList objects do not have a splice method and do not inherit from Array.prototype .

Furthermore, you can't simply invoke a splice on them as they're not designed to be modified even though they are Array-like .

First, convert them to a true Array .

var arr = document.querySelectorAll("a[href*='somestring']"); // NodeList
arr = Array.prototype.slice.call(arr); // Array
arr.splice(2, 2); // splicing an Array

Answer 3

document.querySelectorAll("a[href*='somestring']") return an object not array.

try to convert it to an array:

var arr = document.querySelectorAll("a[href*='somestring']");

var a = [];
for(var i =0;i<arr.length ; i++){
a[i] = arr[i];
} 

a.splice()//now you can use a as an array