jquery - Jquery如何更改具有相同类的三个“div”的值

Question

请我有以下标记：

<div class="item"> 1 a </div>
<div class="item"> 2 b </div>
<div class="item"> 3 c </div>

单击按钮后，我想使用 jQuery 将三个元素的值增加 2 并得到：

<div class="item"> 3 a </div>
<div class="item"> 4 b </div>
<div class="item"> 5 c </div>

请问有什么帮助吗？

非常感谢

Answer 1

您可以在按钮的事件处理程序中执行此操作：

$('.item').each(function(){
   $(this).html(
      $(this).html().replace(/(\d+)/, function(v){return parseInt(v,10)+1})
   );
});

这会增加项目中的第一个数字（如果要增加任何数字，只需将正则表达式更改为/(\d+)/g）。

示范

Answer 2

你应该像这样修改你的html：

<div class="item"> <span>1</span> product </div>
<div class="item"> <span>2</span> product </div>

你的Javascript应该是：

$('.yourbutton').click(function(){
    $( '.item' ).each(function(){
        var actual = parseInt( $(this).find( 'span' ).html() );
        $(this).find( 'span' ).html( actual + 1 );
    }); 
}); 

Answer 3

在这里查看 .appendTo 类

另一方面，使用 .appendTo()，内容在方法之前，作为选择器表达式或作为动态创建的标记，它被插入到目标容器中。