如何循环div的子div并获取子div的id?

时间:2012-07-02 09:51:07

标签: javascript jquery

我有一个带有id测试的div

并通过foreach循环我在测试div中创建了一些内部div。所以它就像这样。

<div id="test">
<div id="test-1"></div>
<div id="test-2"></div>
<div id="test-3"></div>
<div id="test-4"></div>
</div>

我在javascript函数中获取父div“test”。现在我想循环遍历测试div的内部div(子div)并逐个获取每个div的id并通过javascript设置它们。

关于这个的任何想法?

6 个答案:

答案 0 :(得分:24)

试试这个

var childDivs = document.getElementById('test').getElementsByTagName('div');

for( i=0; i< childDivs.length; i++ )
{
 var childDiv = childDivs[i];
}

答案 1 :(得分:9)

您可以使用jQuery .each()函数循环遍历内部div。下面的示例执行此操作,并为每个内部div获取id属性。

$('#test').find('div').each(function(){
    var innerDivId = $(this).attr('id');
});

答案 2 :(得分:3)

这是解决方案,如果有人仍在寻找它

function getDivChildren(containerId, elementsId) {
    var div = document.getElementById(containerId),
        subDiv = div.getElementsByTagName('div'),
        myArray = [];

    for(var i = 0; i < subDiv.length; i++) {
        var elem = subDiv[i];
        if(elem.id.indexOf(elementsId) === 0) {
            myArray.push(elem.id);
        }
    }
    return myArray;
}
console.log(getDivChildren('test', 'test-'));

答案 3 :(得分:0)

您可以使用

$('[id^=test-]')

each()

这种方式例如:

$('[id^=test-]').each(function(){
    var atId = this.id;
    // do something with it
});​

答案 4 :(得分:0)

你要做的是循环遍历#test div的直接后裔div;你可以使用>后代选择器和jQuery .each()迭代器来完成此操作。您还可以使用jQuery .css().attr()方法分别设置样式和检索id。

$("#test > div").each(function(index){
    var id = $(this).attr("id");
    $(this).css(/* apply styles */);
});

答案 5 :(得分:-1)

使用jQuery。

此代码可以根据您的需求进行调整:

$testDiv = ​$('div#test')​​​​​​​​​​​​.first();    
$('div', $testDiv).css("margin", '50px');​​​​