Question

可以计算div中的元素并将它们存储在数组中。

我创建了元素data-head-ref，以了解它们属于内部元素的组。示例： data-head-ref ='region'包含区域的实际元素

动态创建和填充类似于下面结构的数组。如何获取属于jquery的数量和值。

这可能吗？

var headerBlockElements = {
   'region':  {
      'numberItems': 3, // the inside child elements
      'nameItems':  {
         “North”, “South”, “Center”
       }
   },

   'brands': {
      'numberItems': 2,
      'nameItems': {
         “Food”, “Autos”
      }
   }
}

我有以下示例enter link description here

<div class='column-header clearfix' data-head-ref='region'>
    <div class='header-inner'><span class='header-inner-title-dos'>Region</span></div>

    <div class='level-two' data-head='Nort'><span class='title'>Nort</span>
        <div class='level-three' data-option='EEUU'><span class='title'>EEUU</span></div>
        <div class='level-three' data-option='Canada'><span class='title'>Canada</span></div>
        <div class='level-three' data-option='Mexico'><span class='title'>Mexico</span></div>
    </div>
    <div class='level-two' data-head='Sout'><span class='title'>Sout</span>
        <div class='level-three' data-option='Venezuela'><span class='title'>Venezuela</span></div>
        <div class='level-three' data-option='Ecuador'><span class='title'>Ecuador</span></div>
        <div class='level-three' data-option='Argentina'><span class='title'>Argentina</span></div>
        <div class='level-three' data-option='Colombia'><span class='title'>Colombia</span></div>   
        <div class='level-three' data-option='Uruguay'><span class='title'>Uruguay</span></div>
    </div>
    <div class='level-two' data-head='Center'><span class='title'>Center</span>
        <div class='level-three' data-option='Panama'><span class='title'>Panama</span></div>
        <div class='level-three' data-option='Guatemala'><span class='title'>Guatemala</span></div>
        <div class='level-three' data-option='Honduras'><span class='title'>Honduras</span></div>
        <div class='level-three' data-option='Costa Rica'><span class='title'>Costa Rica</span></div>
    </div>
</div>

<div class='column-header clearfix' data-head-ref='Brands'>
    <div class='header-inner'><span class='header-inner-title-dos'>Brands</span></div>

    <div class='level-two' data-head='Food'><span class='title'>Food</span>
        <div class='level-three' data-option='Pizza Hut'><span class='title'>Pizza Hut</span></div>
        <div class='level-three' data-option='Burger King'><span class='title'>Burger King</span></div>
        <div class='level-three' data-option='Taco Bell'><span class='title'>Taco Bell</span></div>
    </div>
    <div class='level-two' data-head='Autos'><span class='title'>Autos</span>
        <div class='level-three' data-option='Toyota'><span class='title'>Toyota</span></div>
        <div class='level-three' data-option='Mazda'><span class='title'>Mazda</span></div>
        <div class='level-three' data-option='Volvo'><span class='title'>Volvo</span></div>
        <div class='level-three' data-option='Chevrolet'><span class='title'>Chevrolet</span></div>
        <div class='level-three' data-option='BMW'><span class='title'>BMW</span></div>
    </div>
</div>

Answer 1

不确定。我对你想要抓住什么感到有些不稳定，但这里应该有所帮助。

PRE JQuery 1.6

var customArray =[];
$('[data-head-ref]').each(function(){
     var Items = ""; 
     $("[data-head]", this).each(function(){
        if(Items.length!=0){Items +=",";}
        Items +=$(this).attr("data-head");
     });

     customArray[$(this).attr('data-head-ref')] =  {
             'numberItems': $("[data-head]", this).length, 
             'nameItems': Items}; 
});

JQuery 1.6 +

var customArray =[];
$('[data-head-ref]').each(function(){
     var Items = ""; 
     $("[data-head]", this).each(function(){
        if(Items.length!=0){Items +=",";}
        Items +=$(this).prop("data-head");
     });

     customArray[$(this).prop('data-head-ref')] =  {
             'numberItems': $("[data-head]", this).length, 
             'nameItems': Items}; 
});

获取data属性的值并使用jquery存储在数组中并存储在数组中

1 个答案:

PRE JQuery 1.6

JQuery 1.6 +