why can’t I use the NodeList constructor to create a NodeList Because the DOM specification for the NodeList interface does not specify the WebIDL [Constructor] attribute, so it cannot be created directly in user scripts. why can’t I cast an array to a NodeList in a similar fashion that NodeLists are cast to arrays? This … Read more
You need to set the target compiler option to es6 or higher for NodeListOf<T> to be iterable.
There is no way to do it without looping through every element. You could, of course, write a function to do it for you. function addEventListenerList(list, event, fn) { for (var i = 0, len = list.length; i < len; i++) { list[i].addEventListener(event, fn, false); } } var ar_coins = document.getElementsByClassName(‘coins’); addEventListenerList(ar_coins, ‘dragstart’, handleDragStart); or … Read more
The simplest way is a for loop: for (let i = 0; i < foo.length; i++) { // Do stuff } This is the best solution, as pointed out here it’s bad practice to use array methods or convert a NodeList to an array – use a different variable if you need to, but a … Read more
A NodeList is collection of DOM elements. It’s like an array (but it isn’t). To work with it, you must turn it into a regular JavaScript array. The following snippet can get the job done for you. const nodeList = document.getElementsByClassName(‘.yourClass’), nodeArray = [].slice.call(nodeList); UPDATE: // newer syntax const nodeList = Array.from(document.querySelectorAll(‘[selector]’)) // or const … Read more
Information about each method details if it is live or not, but there does not seem to be a standard convention for determining it. document.getElementsByClassName() is an HTMLCollection, and is live. document.getElementsByTagName() is an HTMLCollection, and is live. document.getElementsByName() is a NodeList and is live. document.querySelectorAll() is a NodeList and is not live. HTMLCollections appear … Read more
[…nodelist] will make an array of out of an object if the object is iterable. Array.from(nodelist) will make an array out of an object if the object is iterable or if the object is array-like (has .length and numeric props) Your two examples will be identical if NodeList.prototype[Symbol.iterator] exists, because both cases cover iterables. If … Read more
[] is an array. This array isn’t used at all. It’s being put on the page, because using an array gives you access to array prototypes, like .forEach. This is just faster than typing Array.prototype.forEach.call(…); Next, forEach is a function which takes a function as an input… [1,2,3].forEach(function (num) { console.log(num); }); …and for each … Read more
With ES6, we now have a simple way to create an Array from a NodeList: the Array.from() function. // nl is a NodeList let myArray = Array.from(nl)