替换<a href=>链接<img src=>图片

Question

我正在寻找一种方法来查找/替换图像链接。

例如，下面的文本：

<a href="http://domain.com/arbitrary-file.jpg">Text</a> 

到

<img src="http://domain.com/arbitrary-file.jpg" /> 

Answer 1

var linksNodes = document.getElementsByTagName('a'); 
for(var i = 0; i < linksNodes.length; i++) { 

    var a = linksNodes[i]; 
    if(a.href.endsWith(".jpg") || a.href.endsWith(".png")) { 

     var img = document.createElement('img'); 
     img.src = a.href; 
     a.parentElement.replaceChild(img, a); 
    } 

} 

endsWith是ES6但IE11不支持它，边做，但是。您可能需要延长String：

if(!String.prototype.endsWith) { 

    String.prototype.endsWith = function(value) { 

     var expectedIdx = this.length - value.length; 
     return this.indexOf(value, expectedIdx ) == expectedIdx; 
    } 
} 

Answer 2

<a href="http://domain.com/arbitrary-file.jpg" class="test">Text</a> 

<script type="text/javascript"> 
    jQuery(document).ready(function(){ 
var attrib = jQuery('a.test').attr('href'); 
jQuery('a.test').removeAttr('href'); 
jQuery('a.test').attr('src',attrib); 

    }); 

Answer 3

试试这个：

var links = document.getElementsByTagName('a'); 
var i; 
var currentLink; 
var newImg; 

for (i=0; i<links.length; i++) { 

    currentLink = links[i]; 

    newImg = document.createElement('img'); 
    newImg.src = currentLink.href; 

    currentLink.parentNode.insertBefore(newImg, currentLink); 
    currentLink.remove(); 

} 

Answer 4

这是可能使用jQuery。

步骤A：

1. 首先采取<a>标签为div tag.Give唯一ID div标签：
   <div id='divtag'><a href="http://domain.com/arbitrary-file.jpg">Text</a> </div>

2. var value= $('#divtag a').attr('href')

3. $('#divtag').text('<img src="+ value +">Text</img>')。

按照上述步骤完成您的工作，只要你需要。

Answer 5

这里做jQuery中最简单的方法：

$("a").each(function() { 
    $(this).replaceWith("<img src='" + $(this).attr("href") + "'>") 
}) 

图片标签不具有内部文本。所以，你会只是把<a href="http://placehold.it/255x255">Something</a>为<img src="http://placehold.it/255x255">

编辑：如果您想替代文本添加什么的内文中，你可以这样做：

$("a").each(function() { 
    $(this).replaceWith("<img src='" + $(this).attr("href") + "' alt='" + $(this).text() +"'>") 
}) 

这里是你可以运行一个片段：

$("a").each(function() { 
 
    $(this).replaceWith("<img src='" + $(this).attr("href") + "' alt='" + $(this).text() +"'>") 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<a href="http://placehold.it/255x230">Text</a>