Как добавить текст или диапазон чисел в div с помощью javascript?

Question

Я унаследовал файл JS, который идет как это:

var id1 = document.getElementById("id1"); 
    var id2 = document.getElementById("id2"); 
    var id3 = document.getElementById("id3"); 
    var id4 = document.getElementById("id4"); //etc etc. 

мне было интересно, если есть более простой способ использования простого Javascript для добавления номера к идентификатору, который имеет такое же имя, а не список каждую из построчно.

Просьба сообщить.

Спасибо!

Answer 1

var nodes = []; 
 
var find = 6; 
 

 
for (var i = 1; i <= 6; i++) { 
 
    nodes.push(document.getElementById('id' + i)); 
 
} 
 

 
console.log(nodes);

<div id="id1"></div> 
 
<div id="id2"></div> 
 
<div id="id3"></div> 
 
<div id="id4"></div> 
 
<div id="id5"></div> 
 
<div id="id6"></div>

---

Более надежное решение:

Используйте querySelectorAll, чтобы выбрать элементы, которые имеют идентификаторы, начинающиеся с id, затем отфильтровать результаты, которые не соответствуют id с последующим число.

var nodes = document.querySelectorAll('[id^="id"]'); 
 
nodes = [].slice.call(nodes).filter(function(node) { 
 
    return /id\d+/.test(node.id); 
 
}); 
 

 
console.log(nodes);

<div id="id1"></div> 
 
<div id="id2"></div> 
 
<div id="id3"></div> 
 
<div id="id4"></div> 
 
<div id="id5"></div> 
 
<div id="id6"></div> 
 
<!-- This node should not be included --> 
 
<div id="idea"></div>