如何使用jquery显示父和子?

时间:2011-08-02 05:02:33

标签: jquery html css

我有父母和孩子的名单。

Title1
 child1
 child2
 child3
Title2
 child1
 child2
 child3

我想像这样打印父母和孩子

title1_child1
title1_child2
title1_child3
title2_child1
title2_child2
title3_child2

提前致谢

2 个答案:

答案 0 :(得分:1)

var string="";
$(".title childTag").each(function(){
  string += $(this).closest(".title").html() + "_" + $(this).html();
})

像这样的东西

答案 1 :(得分:1)

假设你有以下布局,你可以尝试这个

<ul>
  <li><span>Title1</span>
     <ul>
        <li>Child1</li>
        <li>Child2</li>
        <li>Child3</li>
     </ul>
  </li>
  <li><span>Title1</span>
     <ul>
        <li>Child1</li>
        <li>Child2</li>
        <li>Child3</li>
     </ul>
  </li>
</ul>
<div class="output"></div>

$(function(){
  var parent, str = "", $this;
  $("ul:first li").each(function(){
    $this = $(this);
    parent = $this.find("span").text();
    str = "";
    $this.find("li").each(function(){
      str = str + parent + "_" + $(this).text() + "<br />";
    });
    $(".output").html(str);
  });
});