Question

我需要遍历div及其子节点并获取要在数组中访问的数据值。我可以通过索引正确地控制记录所有信息，并且每个循环子节点但是我无法将它正确地放入一个数组中，每个块被索引，然后另一个循环获取该块中的子节点并从每个块中提取数据属性那些.inner divs。

目前我确实得到了所有.block div作为数组的索引，但是在这些数据中的每一个而不是3组数据属性中（即在第一个.block中有三个.inner div），它只会拉到最后一个设置 - 例如7,56，而我需要它来拉入1,43 3,34 7,56

这是我的HTML

<div id="wrapper">
    <div class="block">
        <div class="inner" data-a='1' data-b="43"></div>
        <div class="inner" data-a="3" data-b="34"></div>
        <div class="inner" data-a="7" data-b="56"></div>
    </div>
    <div class="block">
        <div class="inner" data-a='3' data-b="76"></div>
        <div class="inner" data-a="9" data-b="67"></div>
    </div>
    <div class="block">
        <div class="inner" data-a='5' data-b="33"></div>
        <div class="inner" data-a="4" data-b="22"></div>
    </div>
</div>

和jQuery：

frame  = $('.block');
blockNo = [];

frame.each(function( index ) {
    blockNo.push(index);
    $(this).children().each(function() {
        cell = $(this);
        blockNo[index] = [cell.data('a'),cell.data('b')];
    });      
});

Answer 1

使用

blockNo.push(index);

你建立一个索引号数组只需使用

blockNo.push([cell.data('a'),cell.data('b')]);

在each方法中。

Answer 2

我认为问题在于

blockNo[index] = [cell.data('a'),cell.data('b')];

您正在执行block.o [index]的div.block的子元素的每次迭代，它会不断替换旧值，因此您只获得第三组。

这应该有效

frame  = $('.block');
blockNo = [];

frame.each(function( index ) {

 $(this).children().each(function() {
    cell = $(this);
    blockNo.push([cell.data('a'),cell.data('b')])
 });      
});

Answer 3

你必须建立每个＆＃34;行＆＃34;元素分开：

var frame = $('.block');
var blockNo = [];

frame.each(function( index ) {
    // a new array ("row") for each .block element
    var row = [];

    // fill it up with values
    $(this).children().each(function() {
        row.push([this.getAttribute("data-a"), this.getAttribute("data-b")]);
    });

    // add it to blockNo
    blockNo.push(row);
});

我还制作了frame和blockNo个局部变量（这是人们几乎总是想要的）并用直接DOM .data替换了对getAttribute的调用。如果您不打算一般使用.data访问此信息，那么根本不涉及jQuery的数据存储工具会更有效。

Answer 4

使用.map()和.get()：

DEMO

var blocksArray = $('.block').find('.inner').map(function(){
    return [[$(this).data('a'),$(this).data('b')]];
}).get();

从div建立一系列相关数据

4 个答案: