javascript - 获取父div的所有子元素

我正在尝试获取父DIV中所有子元素的ID和类。

我尝试了以下方法:

HTML

var children = [].slice.call(document.getElementById('container').getElementsByTagName('*'), 0);
document.getElementById('output').innerHTML = children.join('\</br>');

<div id="container">
  <div id="A"></div>
  <div id="B"></div>
  <div id="C"></div>
  <div class="D"></div>
</div>
<div id="output"></div>

但是输出是:

[object HTMLDivElement]
[object HTMLDivElement]
[object HTMLDivElement]
[object HTMLDivElement]

请问我在这里做错了什么？

JSFiddle

最佳答案

我想你会想要这个...

var children = [].slice.call(document.getElementById('container').getElementsByTagName('*'),0);

var elemnts = new Array(children.length);
var arrayLength = children.length;
for (var i = 0; i < arrayLength; i++) {
    var name = children[i].getAttribute("id")||children[i].getAttribute("class");
    elemnts[i]=name;
}
document.getElementById('output').innerHTML = elemnts.join('\</br>');

<div id = "container">
    <div id = "A"></div>
    <div id = "B"></div>
    <div id = "C"></div>
    <div class = "D"></div>
</div>
<div id = "output"></div>

关于javascript - 获取父div的所有子元素，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/33222084/