[英]Regex to transform hashtag in a link without breaking existing HTML code
我想將javascript字符串中的所有URL轉換為鏈接,在此字符串中還有以#標簽開頭的單詞。
截至目前,我在級聯中創建了兩個正則表達式,一個基於url創建html錨標簽,另一個為hashtags創建錨標簽(如在Twitter中)。
我在嘗試將www.sitename.com/index.php#someAnchor解析為正確的標記時遇到了很多問題。
content = urlifyLinks(content);
content = urlifyHashtags(content);
這兩個函數如下:
function urlifyHashtags(text) {
var hashtagRegex = /^#([a-zA-Z0-9]+)/g;
var tempText = text.replace(hashtagRegex, '<a href="index.php?keywords=$1">#$1</a>');
var hashtagRegex2 = /([^&])#([a-zA-Z0-9]+)/g;
tempText = tempText.replace(hashtagRegex2, '$1<a href="index.php?keywords=$2">#$2</a>');
return tempText;
}
function urlifyLinks(inputText) {
var replaceText, replacePattern1, replacePattern2, replacePattern3;
replacePattern1 = /(\b(https?|ftp):\/\/[-A-Z0-9+&@#\/%?=~_|!:,.;]*[-A-Z0-9+&@#\/%=~_|])/gim;
replacedText = inputText.replace(replacePattern1, '<a href="$1" target="_blank">$1</a>');
replacePattern2 = /(^|[^\/])(www\.[\S]+(\b|$))/gim;
replacedText = replacedText.replace(replacePattern2, '$1<a href="http://$2" target="_blank">$2</a>');
replacePattern3 = /(\w+@[a-zA-Z_]+?\.[a-zA-Z]{2,6})/gim;
replacedText = replacedText.replace(replacePattern3, '<a href="mailto:$1">$1</a>');
return replacedText;
}
我正在考慮解析urlifyLinks的輸出並將正則表達式應用於第一級文本元素的所有dom元素,這是一個難看的事情嗎?
您可以通過使用具有回調函數替換的單個正則表達式來避免此問題。
function linkify(str){
// order matters
var re = [
"\\b((?:https?|ftp)://[^\\s\"'<>]+)\\b",
"\\b(www\\.[^\\s\"'<>]+)\\b",
"\\b(\\w[\\w.+-]*@[\\w.-]+\\.[a-z]{2,6})\\b",
"#([a-z0-9]+)"];
re = new RegExp(re.join('|'), "gi");
return str.replace(re, function(match, url, www, mail, twitler){
if(url)
return "<a href=\"" + url + "\">" + url + "</a>";
if(www)
return "<a href=\"http://" + www + "\">" + www + "</a>";
if(mail)
return "<a href=\"mailto:" + mail + "\">" + mail + "</a>";
if(twitler)
return "<a href=\"foo?bar=" + twitler + "\">#" + twitler + "</a>";
// shouldnt get here, but just in case
return match;
});
}
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.