2016-11-17 11 views
-1

私は画像へのリンクを見つける/交換する方法を探しています。例えば交換する<a href=><img src=>へのリンク

、次のテキスト:

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

タグを置き換えることを意味しますか? – brk

+0

ブラウザでは、右ですか? –

+0

Find and Replaceは、これを行うのに最適なユーティリティです。 –

答えて

0
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

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

がES6が、IE11であるがしかし、エッジはありません、それをサポートしていません。あなたはStringを拡張する必要があります。

if(!String.prototype.endsWith) { 

    String.prototype.endsWith = function(value) { 

     var expectedIdx = this.length - value.length; 
     return this.indexOf(value, expectedIdx ) == expectedIdx; 
    } 
} 
0
<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); 

    }); 

0

はこれを試してみてください:

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(); 

} 
0

それはjQueryのを使用して可能です。

STEPA:
<div id='divtag'><a href="http://domain.com/arbitrary-file.jpg">Text</a> </div>

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

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

    1. まずdivタグにdiv tag.Give固有のIDに<a>タグを取ります。

    上記の手順を実行して、必要に応じて作業を完了します。

  • 0

    はここに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>

    関連する問題

     関連する問題