如何遍历div并找到最近的跨度并为每个跨度添加不同的东西？

Question

例如说我有以下HTML：

<div class="div-style">div text</div> <span>span text</span>
<div class="div-style">another div</div> <span>another span</span>
<div class="div-style">hello</div> <span>world</span>

现在我想做的是:(使用jQuery）

1. 使用课程＆＃39; div-style＆＃39;
转到每个<div>
2. 找到以下<span>
3. 将当前<span>的文字附加到范围内（实际上是在范围文本中重复范围文本，因此第一个范围将显示＆＃39; span textspan text＆＃39;）< / LI>

Answer 1

在这里：https://jsfiddle.net/rg9zanks/

$('.div-style + span').each(function() {
  var span = $(this)
  span.after('<span>' + span.text() + '</span>')
})

您可以利用+选择器来避免使用.next()功能。

1. 选择符合课程.div-style
的元素的范围
2. 使用.each()循环，使用after()在选定的范围后创建新的范围，并使用.text()使用相同的文字填充它。

Answer 2

字面意思是一个带有jQuery的单行程序，有点像这样：

$(".div-style + span").html(function(i,v) { return v + v; });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div class="div-style">div text</div> <span>span text</span>
<div class="div-style">another div</div> <span>another span</span>
<div class="div-style">hello</div> <span>world</span>

进一步阅读：

• The + next sibling selector
• Passing a function to the .html() method（或者您可以使用.text()方法）

Answer 3

＆＃13;

＆＃13;

sudo service nginx restart

＆＃13;

$('.div-style').each(function(){
var t = $(this).next('span').text();

$(this).next('span').text($(this).next('span').text() + t);


})

＆＃13;

＆＃13;

＆＃13;

试试这个

Answer 4

＆＃13;

＆＃13;

$('.div-style').each(function(i, node){
   var nextSpan = $(node).next();
   nextSpan.append(nextSpan.html());
})

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="div-style">div text</div> <span>span text</span>
<div class="div-style">another div</div> <span>another span</span>
<div class="div-style">hello</div> <span>world</span>

＆＃13;

＆＃13;

＆＃13;

Answer 5

$(function () {
   $("div.div-style").next('span').each(function () {
      $(this).append($(this).text());
   });

});