querySelectorAll не работал, но querySelector сделал

Question

Создание простого расширения для хром. Вторая функция не работает при изменении «querySelector» на «querySelectorAll».

var ele2 = document.querySelectorAll(".view-count "); 
    window.onload = function(){ 
     func2(); 
    } 

function func2(){ 
    ele2.innerHTML = ele2.innerHTML.trim(); 
    ele2.innerHTML = ele2.innerHTML.slice(0, -14); 
    ele2.textContent = "$" + ele2.innerHTML.replace(/ /g,' '); 
    } 

Решение:

for (x=0;x<ele2.length;x++){ele2[x].innerHTML = ele2[x].innerHTML.trim();} 
for (x=0;x<ele2.length;x++){ele2[x].innerHTML = ele2[x].innerHTML.slice(0, -14);} 
for (x=0;x<ele2.length;x++){ele2[x].textContent = "$" + ele2[x].innerHTML.replace(/&nbsp;/g,' ');} 

Answer 1

querySelectorAll возвращает коллекцию узлов, в отличие от querySelector, который возвращает один узел.
Чтобы добраться до узла в коллекции, вам придется ссылаться на него с помощью индекса.

ele2[0].innerHTML = ele2[0].innerHTML.trim(); 

Answer 2

querySelector возвращает первый запрос на основе значения параметра. querySelectorAll возвращает список в структуре, подобной массиву. Чтобы получить отдельный элемент внутри списка, используйте индекс. Exp,

ele2[0] // first iteration 
ele2[1] // second iteration