1

我正在尝试从多个 div 的无序列表中获取多个属性,如下所示:

    <div class="graph" style="display:none;">
        <ul g-max='10'>
            <li g-color='green' g-val='4'></li>
            <li g-color='blue' g-val='3.6'></li>
            <li g-color='red' g-val='8'></li>
        </ul>
    </div>

    <div class="graph" style="display:none;">
        <ul g-max='14'>
            <li g-color='green' g-val='2'></li>
            <li g-color='blue' g-val='9'></li>
            <li g-color='red' g-val='3.98'></li>
        </ul>
    </div>

我正在尝试使用 jQuery 执行此操作,并且正在使用以下内容:

    var graph_array = [];

    $('.graph').each(function(divind)
    {
          $('ul').each(function(ulind)
          {
               $('li').each(function(liind)
               {
                     graph_array[divind][ulind][liind]['g-val'] = $(this).attr('g-val');
                     graph_array[divind][ulind][liind]['g-color'] = $(this).attr('g-color');
               });
          });
    });
    alert(graph_array);

但是,即使我四处移动并尝试不同的技术,例如.map()or .toArray(),也没有任何效果。有任何想法吗?提前致谢!

编辑:我想要一个看起来像这样的最终结果:

    [{
       {
         {g-color:green, g-val:4},{g-color:blue, g-val:3.6},{g-color:red, g-val:8}
       },
       {
         {g-color:green, g-val:2},{g-color:blue, g-val:9},{g-color:red, g-val:3.98}
       }
    }]
4

3 回答 3

2

您需要实例化数组或预填充它们。像这样,例如:

var graph_array = [];
$('.graph').each(function(divind, e)
{
      $(e).find('ul').each(function(ulind, e)
      {
           $(e).find('li').each(function(liind, e)
           {
               // create level 1 sub-array, or use existing
               var level1 = (graph_array[divind] || (graph_array[divind] = []));

               // create or re-use level #2 sub-array
               var level2 = (level1[ulind] || (level1[ulind] = []));

               // create a property map
               var map = (level2[liind] = {});
               map ['g-val'] = $(e).attr('g-val');
               map ['g-color'] = $(e).attr('g-color');
           });
      });
});
// display as a string
alert(JSON.stringify(graph_array));​

请参阅此处的工作示例:http: //jsfiddle.net/Q57W5/5/

于 2012-10-20T20:41:45.637 回答
1

这里要注意的主要事情是您没有初始化您尝试附加到的数组。您需要为每个组初始化一个数组。这里要做的另一件事是利用each函数的范围及其两个参数之一。

$.each($(element_array),function(index,elem){
  // $(this)
  // $(elem) 
});

我列出了两种可互换的方式,您可以使用 the 范围each并使用this关键字。当你在循环的每次迭代中each,当前项都可以在$(this)变量中找到。你也可以使用$(elem).

如果您有嵌套each命令,我发现最好为每个嵌套循环使用不同的变量,而不是使用this. 我觉得它不那么令人困惑。

所以基本上你需要做的是使用相对当前变量在其死者中搜索。

var graph_array = [];

$('.graph').each(function(divIndex,currentDiv) {
  if (graph_array[divIndex] == undefined){ graph_array[divIndex] = []; }
  $(currentDiv).find('ul').each(function(ulIndex,currentUl) {
    if (graph_array[divIndex][ulIndex] == undefined){ graph_array[divIndex][ulIndex] = []; }
    $(currentUl).find('li').each(function(liIndex,currentLi) {
      if (graph_array[divIndex][ulIndex][liIndex] == undefined){ graph_array[divIndex][ulIndex][liIndex] = []; }     
      graph_array[divIndex][ulIndex][liIndex]['g-val'] = $(currentLi).attr('g-val');
      graph_array[divIndex][ulIndex][liIndex]['g-color'] = $(currentLi).attr('g-color');
    });
  });
});

console.log(graph_array);​

现场演示

于 2012-10-20T20:32:46.840 回答
0

做这样的事情: -

var graphArray = new Array();
$(".graph ul li").each(function(i) {
    graphArray[i] = $(this).attr("g-color") + ":" + $(this).attr("g-val");
});

alert(graphArray);
于 2012-10-20T20:35:15.590 回答