Wie fügt man einem div einen Text oder Zahlenbereich mit Javascript hinzu?

Question

erbte ich eine JS-Datei, die wie folgt lautet:

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

ich mich gefragt, ob es einen einfacheren Weg mit Normalpapier Javascript ist eine Zahl zu einer ID anhängen, die den gleichen Namen hat, anstatt jeden sehen und Zeile für Zeile.

Bitte beraten.

Danke!

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>

---

Eine robustere Lösung:

Verwenden querySelectorAll Elemente auszuwählen, die IDs, die mit id beginnen, dann die Ergebnisse herauszufiltern, die nicht id gefolgt passen durch eine Zahl.

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>