jQuery循环每个元素的id

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-*示例中属性的使用.