js實現的將文字中的url網址轉換為可以點選的連結

antzone發表於2017-03-26

在很多網站中,當我們輸入一段文字的時候,如果裡面帶有連結地址,地址會被轉換為可以點選的連結,這其實不是瀏覽器的恩賜,而是需要我們程式設計師自己去實現,本站也具有這樣的功能,並且可以根據會員的等級進行限制,當然這不是本章節的重點,下面就通過例項程式碼介紹一下如何實現將網址轉換為可以點選的連結的功能。

程式碼如下:

[HTML] 純文字檢視 複製程式碼
<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://www.softwhy.com/" />
<title>螞蟻部落</title>
<script type="text/javascript"> 
String.prototype.httpHtml=function(){ 
  var reg = /(http:\/\/|https:\/\/)((\w|=|\?|\.|\/|&|-)+)/g; 
  return this.replace(reg, '<a target=_blank href="$1$2">$1$2</a>'); 
}; 
var str="歡迎來到螞蟻部落,網址是:http://www.softwhy.com";
window.onload=function(){
  var odiv=document.getElementById("thediv");
  odiv.innerHTML=str.httpHtml();
}
</script>
</head>
<body>
<div id="thediv"></div>
</body>
</html>

上面的程式碼實現了我們的要求,可以將字串中的url文字內容轉換為可以點選的連結。

相關文章