在javascript中打印一个类的所有id名称

-5

我想打印具有类名“test”的每个元素的Id。现在没有什么打印。我想这对打印在javascript中打印一个类的所有id名称

myAnchor 
SecondId

我离开了我的意见在那里展示如何的标识可以通过访问ID名称打印

这是我的脚本

<!DOCTYPE html> 
<html> 
<body> 

<p><a id="myAnchor" class="test" href="http://www.w3schools.com/">W3Schools</a></p> 
<p><a id="SecondId" class="test" href="http://www.w3schools.com/">Second</a></p> 

<p>Click the button to display the value of the id attribute of the link above.</p> 

<button onclick="myFunction()">Try it</button> 

<p id="demo"></p> 

<script> 
function myFunction() { 
    //var x = document.getElementById("myAnchor"); 
    //document.getElementById("demo").innerHTML = x.id; 
    var x = document.getElementByClassName("test"); 
    for(count = 0; count < x.length; count++){ 
     document.getElementById("demo").innerHTML = x.id; 
    } 
} 
</script> 

</body> 
</html>

来源

2017-02-10 Jacob

'var x = document.getElementsByClassName（“test”）;'还有'document.getElementById（“demo”）。innerHTML = x [count] .id;' –

可能需要'... innerHTML + = .. .'连接所有的ID。 – RobG

每次迭代都覆盖'demo'。另外，在for循环中使用'var'或者创建一个隐式的全局变量。 –

您已经只是得到了几个基本的错别字：

document.getElementByClassName("test")应该document.getElementsByClassName("test')
document.getElementById("demo").innerHTML = x.id应该document.getElementById("demo").innerHTML += x[count].id

这是因为getElementsByClassName函数返回元素的数组，所以你需要从数组，而不是数组本身获得的每个元素。

此外，您每次都覆盖demo。使用+=运算符而不是=运算符将字符串连接到原始文件的末尾，而不是将原始文件设置为新字符串。

来源

2017-02-10 21:47:11 Toastrackenigma

我不会低调，因为downvoting正确的答案不好，但如果问题的答案是一个错字，它确实应该被关闭。 –

如果只有问题与upvoted答案将有资格在一段时间后自动删除... –

一些变化在这里：

（而不是getElementByClassName，这是不是一个功能 - 除非你是某处定义它）使用getElementsByClassName()。
为了访问元素在id属性为循环，使用x[count].id，因为x是一个节点列表，我们需要在指数计数访问元素。但是对于更简单的方法，使用Array.forEach()（连同function.call，因为元素列表是NodeList而不是本地Array实例）遍历元素列表。这样id属性可以通过element.id获得，而不是手动索引到元素数组中。另外，您不必担心增加循环变量。

var testElements = document.getElementsByClassName("test"); Array.prototype.forEach.call(testElements, function(element) { //access elements via callback argument element });

由于它与书面循环，你将需要访问x[count].id为了获得ID属性的值。

获取对id为demo的元素的引用，然后在添加到innerHTML属性时引用该元素。

var demo = document.getElementById("demo"); //in loop - refer to demo - e.g. demo.innerHTML

这样，每次添加id属性值时都不会获取对DOM元素的引用。

使用plus-equal运算符（即+=）向innerHTML（string）属性添加（附加）。

demo.innerHTML += element.id;

，你可能会想单独的值（例如用空间，break tag（即 ）等

demo.innerHTML += element.id + ' ';

看到的变化如下实施：

function myFunction() { var demo = document.getElementById("demo"); var testElements = document.getElementsByClassName("test"); Array.prototype.forEach.call(testElements, function(element) { demo.innerHTML += element.id+' '; }); }

<a id="myAnchor" class="test" href="http://www.w3schools.com/">W3Schools</a> <a id="SecondId" class="test" href="http://www.w3schools.com/">Second</a> Click the button to display the value of the id attribute of the link above. <button onclick="myFunction()">Try it</button> 

来源

2017-02-10 21:48:32

'forEach'与'for'是微不足道的，不回答OPs问题。 –

在更新后的解释中查看推理 - 点＃2 –

在javascript中打印一个类的所有id名称

回答

相关问题