url來源圖片javascript

Question

所以我讀this question，我想用它的答案，但作爲覆蓋我放入的一切，如果我例如添加一個紅色的div它消失。我怎樣才能使這個JavaScript的工作以及與我的其他HTML ...

var newHTML = replaceWithImgLinks($(document.body).text()); 
$(document.body).html(newHTML); 
function replaceWithImgLinks(txt) { 
var linkRegex = /([-a-zA-Z0-9@:%_\+.~#?&//=]{2,256}\.[a-z]{2,4}\b(\/[-a-zA-Z0-9@:%_\+.~#?&//=]*)?(?:jpg|jpeg|gif|png))/gi; 
var replacement = '<a href="$1" target="_blank"><img class="sml" src="$1" /></a><br />' 
return txt.replace(linkRegex, replacement); 
} 

（IM愚蠢的，我的JavaScript知識不是最好的），如果你能解釋爲什麼它不工作藏漢我會很滿意:)

這裏是一個fiddle藏漢所以你可以看到我的問題：

所以我試圖做的是使所有在我的div的IMGS索馬里紅新月會更改爲圖片「，而不是整個身體我認爲「

Answer 1

如果你不需要參數s的URL，你可以在正則表達式的末尾使用\S*。

/([-a-zA-Z0-9@:%_\+.~#?&//=]{2,256}\.[a-z]{2,4}\b(\/[-a-zA-Z0-9@:%_\+.~#?&//=]*)?(?:jpg|jpeg|gif|png))\S*/gi 

而且，我已經改變了，你叫&內的JQuery替換類：很多

function replaceWithImgLinks(txt) { 
 
    var linkRegex = /([-a-zA-Z0-9@:%_\+.~#?&//=]{2,256}\.[a-z]{2,4}\b(\/[-a-zA-Z0-9@:%_\+.~#?&//=]*)?(?:jpg|jpeg|gif|png))\S*/gi; 
 
    return txt.replace(linkRegex, '<a href="$1" target="_blank"><img class="sml" src="$1" /></a><br />'); 
 
} 
 

 
var newHTML = replaceWithImgLinks($('.chatMessages').html()); 
 
$('.chatMessages').html(newHTML);

.chatMessages{ 
 
    height:200px; 
 
    width:200px; 
 
    background-color:red; 
 
} 
 
.sml{ 
 
    height:100px; 
 
    width:100px; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script> 
 
<div class = "chatMessages"> 
 
https://i.stack.imgur.com/qgNyF.png?s=328&g=1 
 
</div>