基于每个元素预先存在的唯一属性，复制/更改多个元素的属性

Duplicate/change attribute of multiple elements based on pre-existing, unique attribute per element

本文关键字：元素 属性 复制 唯一 于每个 存在      更新时间：2023-09-26

如何为一组已经创建（动态创建）和dupe&在相同的各个元素上发生变化？例如：

<div class="category" data-category-name="Pizza">Pizza</div>
<div class="category" data-category-name="Burgers">Burgers</div>
<div class="category" data-category-name="Drinks">Drinks</div>

这些需要添加另一个属性，比如"数据开放类别"，并且需要获得"数据类别名称"属性的值，如下所示：

<div class="category" data-category-name="Pizza" data-open-category="Pizza">Pizza</div>
<div class="category" data-category-name="Burgers" data-open-category="Burgers">Burgers</div>
<div class="category" data-category-name="Drinks" data-open-category="Drinks">Drinks</div>

尝试使用.attr()、.data()

$("[data-category-name]").attr("data-open-category", function(_, val) {     
  // set both `.attr()` , `.data()`
  return ($(this).data().openCategory = $(this).data().categoryName)
});
$("[data-open-category]").each(function() {
  console.log($(this).data(), $(this).attr("data-open-category"))
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js">
</script>
<div class="category" data-category-name="Pizza">Pizza</div>
<div class="category" data-category-name="Burgers">Burgers</div>
<div class="category" data-category-name="Drinks">Drinks</div>

使用.each添加数据attr

  $(".category").each(function() {
    var cat = $(this).data("category-name")
    $(this).attr("data-open-category", cat)
})

Fiddle

相关文章：