Jquery：根据 <div> 的数量动态添加 <tag>答案

【问题标题】：Jquery: Dynamic adding <tag> depending on number of <div>Jquery：根据 <div> 的数量动态添加 <tag>
【发布时间】：2011-08-28 22:58:35
【问题描述】：

我的问题是如何根据 div 的数量添加列表。结果将用于滑动横幅的分页/导航

<div class="panel">
  <section>
    <h2>...</h2>
    <p>...</p>
  </section>      
</div>
<div class="panel">
  <section>
    <h2>...</h2>
    <p>...</p>
  </section>      
</div>
<div class="panel">
  <section>
    <h2>...</h2>
    <p>...</p>
  </section>      
</div>

结果应该是这样的

<ul id="pagging">
  <li><a href="#">nav1</li>
  <li><a href="#">nav2</li>
  <li><a href="#">nav3</li>
</ul>

但对我们来说，我们希望它在 jquery 中完成。我们的jquery会先统计div个数，然后根据div个数动态添加LI

【问题讨论】：

标签： jquery slider javascript-framework

【解决方案1】：

var divCount = $("div.panel").length;

for(var i=0;i<divCount;i++){
   $("ul#pagging").append($("<li/>").text("nav"+(i+1)));
}

另外，Paging 只有一个 g。

http://jsfiddle.net/R8mxg/

【讨论】：

【解决方案2】：

使用 JQuery.each

$("div.panel").each(function(idx){
      $("#pagging").append($("<li/>").text("nav"+(idx+1)));
})

注意：基于 kingjiv 的内部代码

【讨论】：

【解决方案3】：

http://jsfiddle.net/yhufH/

添加/删除要测试的 div

【讨论】：