Question

我想根据子项的数量为容器元素添加一个类。但我的代码广告只是第一个容器的一个类，而且添加错误。

这就是我想要做的事情：

<ul>
 <li>
  <div id="container" class="add class here for example col3">
   <div class="child"></div>
   <div class="child"></div>
   <div class="child"></div>
  </div>
 </li>
 <li>
  <div id="container" class="add class here for example col1">
   <div class="child"></div>
  </div>
 </li>
</ul>

我为一个案例编写了这个代码，当容器只有一个孩子但它不起作用时。这会将col1类广告给第一个有3个孩子的容器:(

window.addEvent('domready', function() {
    var children = $('container').getChildren('div.child');
    if(children.length = 1) {
      $('container').set('class', 'col1');
    }
});

所以我被困在这里。

Answer 1

您的问题是您为所有容器分配了相同的ID。尝试这样的事情：

window.addEvent("domready", function(){
    $$("div.container").each(function(item, i){
        var childCount = item.getChildren("div.child").length;
        item.addClass("col" + childCount);
    });
});

HTML：

<ul>
 <li>
  <div class="container">
   <div class="child"></div>
   <div class="child"></div>
   <div class="child"></div>
  </div>
 </li>
 <li>
  <div class="container">
   <div class="child"></div>
  </div>
 </li>
</ul>

在此处查看：http://jsfiddle.net/kSVL5/

Mootools按子节点数将类添加到容器中

1 个答案: