Скрипт выбирает один элемент и не регирует на innerHtml

351

06 июня 2017, 02:04

Есть такой скрипт

function chooseElement(e) { 
 
  var selectr = document.querySelectorAll(e); 
  for (var i = 0; i < selectr.length; i++) { 
 
    return selectr[i]; 
 
  } 
 
} 
 var x = chooseElement('.hello'); 
  x.style.color = "red"; 
 var y = chooseElement('.hello2'); 
  y.innerHtml = "Span";

<span class="hello">Мой тег span</span><br> 
<span class="hello">Мой тег span</span><br> 
<span class="hello">Мой тег span</span><br> 
<span class="hello">Мой тег span</span><br> 
<span class="hello2">Мой тег span2</span><br> 
<span class="hello2">Мой тег span2</span><br> 
<span class="hello2">Мой тег span2</span><br>

Вопрос, почему он выбирает только один элемент а innerHtml отказывается работать?

Answer 1

Первая же итерация цикла натыкается на return, поэтому выходит из функции, возвращая только первый элемент.
Свойства innerHtml нет, есть innerHTML:

function chooseElement(e) { 
  return Array.from(document.querySelectorAll(e)); // Выбираем элементы и перегоняем их в массив 
} 
 
let x = chooseElement('.hello'); 
x.forEach(x => x.style.color = "red"); 
 
let y = chooseElement('.hello2'); 
y.forEach(y => y.innerHTML = "Span");

<span class="hello">Мой тег span</span><br> 
<span class="hello">Мой тег span</span><br> 
<span class="hello">Мой тег span</span><br> 
<span class="hello">Мой тег span</span><br> 
<span class="hello2">Мой тег span2</span><br> 
<span class="hello2">Мой тег span2</span><br> 
<span class="hello2">Мой тег span2</span><br>