как петля над дочерними divs div и получить идентификаторы дочерних divs?

У меня есть div с id test

и через цикл 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>

Я получаю родительский div id "test" в функции javascript. Теперь я хочу пройти через внутренние divs (дочерние div) тестового div и получить идентификатор каждого div один за другим и создать их через javascript.

Любая идея об этом?

Ответы

Ответ 1

Вы можете перемещаться по внутренним divs с помощью функции jQuery.each(). Следующий пример делает это, и для каждого внутреннего div он получает атрибут id.

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

Ответ 2

Попробуй это

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

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

Ответ 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-'));

Ответ 4

Вы можете использовать

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

и каждый()

таким образом, например:

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

Ответ 5

То, что вы пытаетесь сделать, - это прохождение прямых div-потомков div #test; вы сделали бы это с помощью селектора > потомков и итератора jQuery .each(). Вы также можете использовать методы jQuery .css() и .attr() для стилизации и получения идентификатора соответственно.

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

Ответ 6

Используйте jQuery.

Этот код может быть добавлен к вашим потребностям:

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