如何更改<img/>标记的内部html？

Question

这是输出：

<img width="1080" height="1080" src="/image.jpg" class="post-image" alt="image" /> 

我需要将其更改为：（src→data）

<img width="1080" height="1080" data="/image.jpg" class="post-image" alt="image" /> 

Answer 1

您可以使用jQuery的attr和removeAttr，get，set和remove属性。

＆＃13;

＆＃13;

var img = $("img");
img.attr("data", img.attr("src")).removeAttr("src");

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<img width="1080" height="1080" src="/image.jpg" class="post-image" alt="image" />

＆＃13;

＆＃13;

＆＃13;

Answer 2

只需使用下面简单的JQ：

首先获取src，然后将其添加为data，然后移除src

＆＃13;

＆＃13;

var src = $("img").attr("src")
$("img").attr("data", src).removeAttr("src")

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<img width="1080" height="1080" src="/image.jpg" class="post-image" alt="image" />

＆＃13;

＆＃13;

＆＃13;