Question

所以例如我有一个由easytab创建的页面早午餐，如下面的HTML

<div class="tab-page1 identify">//something</div>

<div class="tab-page2 identify">//something</div>

<div class="tab-page3 identify">//something</div>

<div class="tab-page4 identify">//something</div>

我想在内容中添加一些东西，所以我创建了一个类似下面的函数

$(".identify").html("123");

我知道我可以做一些事情，比如在最后一个孩子身上添加一些东西，但我想在每个孩子中添加123，我该怎么办呢？

$(".identify:last-child").html("123");

Answer 1

我想在内容中加入一些内容

但是我想在每个孩子中添加123我该怎么办？

您可以使用.html(function)向现有html内容添加新的html。

$(".identify").html(function(index, html) {
  return html + 123
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="tab-page1 identify">//something</div>

<div class="tab-page2 identify">//something</div>

<div class="tab-page3 identify">//something</div>

<div class="tab-page4 identify">//something</div>

Answer 2

您可以使用.each函数迭代每个找到的节点并执行一个函数：

$(".identify").each(function(){
    $(this).html("123");
});

Example JSFiddle

Answer 3

您不需要循环来实现此目的。检查

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<script>
$(document).ready(function(){
    $("#btn").click(function(){
        $(".identify").html("123");
    });
});
</script>


<div class="tab-page1 identify">//something</div>

<div class="tab-page2 identify">//something</div>

<div class="tab-page3 identify">//something</div>

<div class="tab-page4 identify">//something</div>

<button id="btn">Do it</button>

</body>

＆＃13;

Answer 4

使用附加向现有内容添加内容：

$(".identify").each(function(){
    $(this).append("123");
});

Javascript：循环遍历每个子节点

4 个答案: