如何循环使用div的子div并获得子div的id ?

I have a div with id test

我有一个带id测试的div

and through the foreach loop I am creating some inner divs inside the test div. So it becomes like this.

通过foreach循环，我在test 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>

I am getting the parent div id "test" in the javascript function. Now I want to loop through the inner divs(child divs) of the test div and get the id of the each div one by one and style them through javascript.

我在javascript函数中获取父div id“test”。现在，我要循环遍历测试div的内部div(子div)，并逐个获得每个div的id，并通过javascript对它们进行样式化。

Any Idea about this?

什么想法?

6 个解决方案

#1

You can loop through inner divs using jQuery .each() function. The following example does this, and for each inner div, it gets the id attribute.

可以使用jQuery .each()函数循环内部div。下面的示例就是这样做的，对于每个内部div，它都获得id属性。

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

#2

Try this

试试这个

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

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

#3

Here's the solution if somebody still looks for it

如果有人还在找，这就是解决办法

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-'));

#4

You can use

您可以使用

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

and each()

和每一个()

this way for example :

例如:

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

#5

What you are trying to do is loop through the direct-descendant divs of the #test div; you would do this using the > descendant selector, and the jQuery .each() iterator. You can also use the jQuery .css() and .attr() methods for styling and retrieving the id respectively.

您要做的是通过#test div的直接后代div进行循环;您将使用>后代选择器和jQuery .each()迭代器来实现这一点。您还可以使用jQuery .css()和.attr()方法分别对id进行样式化和检索。

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

#6

-1

Use jQuery.

使用jQuery。

This code can be addapted to your needs:

此代码可根据您的需要添加:

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

#1