jquery 将内部文本替换< a>为< img>

of1yzvn4  于 2022-12-26  发布在  jQuery
关注(0)|答案(4)|浏览(165)

我有这个:

<div class="blog-page-nav-previous">
    <a href="my-link" class="blog-link">&lt;&lt;Previous</a>
</div>

我试图找到类blog-page-nav-previous的所有示例,并替换<a>标记中的文本:&lt;&lt;Previous和我自己的图像。
我该怎么做呢?

7rfyedvj

7rfyedvj1#

你可以试试这个

var a = document.getElementsByClassName("blog-page-nav-previous");

a.forEach(function(a){
  a.outerHTML = '<img src="images/image.jpg" alt="image">'
});

如果只尝试替换元素的内容,则可以将.outerHTML替换为.innerHTML

62o28rlo

62o28rlo2#

既然您要求的是jQuery解决方案:

// Select all the <a> tags inside .blog-page-nav-previous and change their innerHTML to an <img> tag:
$('.blog-page-nav-previous a').html('<img src="foo.jpg">');
<div class="blog-page-nav-previous">
    <a href="my-link" class="blog-link">&lt;&lt;Previous</a>
</div>
46qrfjad

46qrfjad3#

我认为你想图像作为一个链接,如果是的话,我有一个解决方案给你

<div class="blog-page-nav-previous">
    <a href="my-link" class="blog-link"><img src="example.png"></a>
</div>

这应该工作,对不起,如果这不是你想要的答案

a5g8bdjr

a5g8bdjr4#

这应该行得通:

var myClasses = document.getElementsByClassName("blog-page-nav-previous");

for (var i = 0; i < myClasses.length; i++) {
  myClasses[i].innerHTML = "<img src='image.jpg'>";
  }
<div class="blog-page-nav-previous">
 <a href="my-link" class="blog-link">Previous</a>
</div>

如果您希望图像保持与"Previous"设置相同的链接,请更改getElementByClassName以查找"my-link"而不是"blog-page-nav-previous"

相关问题