如何在p标记中动态附加数据属性值

How to append data attribute value in p tag dynamically

本文关键字:动态 数据属性      更新时间:2023-09-26

"lt;div class=";文本";数据名称=";test1">lt/div>quot
<div class=";文本";数据名称=";test1">lt/div>
<div class=";文本";数据名称=";test1">lt/div>
<div class=";文本";数据名称=";test1">lt/div>
<div class=";文本";数据名称=";test1">lt/div>

append应该像这个

<div class=";文本">lt;p>测试1<p>lt/div>
<div class=";文本">lt;p>测试2<p>lt/div>

像这样:

$('div.text').each(function() {
  var $this = $(this);
  $this.append($('<p>').html($this.data('name')));
});

转换元素的一种方法。

$('div[data-name]').each(function() {
  var data = $(this).data("name");
  $(this).removeAttr( "data-name" );
  data = data.slice(0, 4) + " " + data.slice(4);
  $(this).append("<p>" + data);
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="text" data-name="test1"> </div>
<div class="text" data-name="test1"> </div>
<div class="text" data-name="test1"> </div>
<div class="text" data-name="test1"> </div>
<div class="text" data-name="test1"> </div>