Question

嗨，我有一些关于循环逻辑的问题

有一些元素

<div place="1" area="Text 1" class="element"></div>
<div place="2" area="Text 2" class="element"></div>
<div place="3" area="Text 3" class="element"></div>

和

<span place="1"></span>
<span place="2"></span>
<span place="3"></span>

我希望将所有div元素区域属性值插入到哪个地方相同的span元素

像这样

<span place="1">Text 1</span>
<span place="2">Text 2</span>
<span place="3">Text 3</span>

Answer 1

首先请注意，在HTML中创建自己的非标准属性可能会导致一些奇怪的行为。使用data属性来存储带元素的任何自定义元数据会更好。

要解决实际问题，您需要遍历所有div元素，然后选择span与相关place并设置其text()，就像这样：

$('.element').each(function() {
  $('span[data-place="' + $(this).data('place') + '"]').text($(this).data('area'));
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div data-place="1" data-area="Text 1" class="element"></div>
<div data-place="2" data-area="Text 2" class="element"></div>
<div data-place="3" data-area="Text 3" class="element"></div>

<span data-place="1"></span>
<span data-place="2"></span>
<span data-place="3"></span>

请注意示例中使用data-*属性。

Answer 2

使用jQuery查看以下答案

$(document).ready(function(){

  $("div[place]").each(function(i,el){
    $("span[place='"+$(this).attr("place")+"']").html($(this).attr("area"));
  })
  
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div place="1" area="Text 1" class="element"></div>
<div place="2" area="Text 2" class="element"></div>
<div place="3" area="Text 3" class="element"></div>

<span place="1"></span>
<span place="2"></span>
<span place="3"></span>

Answer 3

您应该使用data-属性来制作类似的内容：

ft.

您的HTML结构应该看起来：

)[^-). ]+

Answer 4

您可以这样做：

$('.element').each(function(i, obj) {
    var area= $(obj).attr('area');
    var span = $('<span></span>');
    span.attr('place', i);
    span.text(area);
});

jQuery循环每个元素的id

4 个答案: