Regex pour transformer le hashtag dans un lien sans casser le code HTML existant

Question

Je veux convertir toutes les URL dans une chaîne de javascript aux liens, dans ces chaînes il y a aussi des mots qui commencent par un hashtag #.

A partir de maintenant, j'ai créé deux regex en cascade, l'un qui crée des balises d'ancrage html basées sur des URL et un autre qui crée des balises d'ancrage pour les hashtags (comme sur Twitter).

J'ai beaucoup de problèmes à essayer d'analyser www.sitename.com/index.php#someAnchor dans le bon balisage.

content = urlifyLinks(content); 
content = urlifyHashtags(content); 

où les deux fonctions sont les suivantes:

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; 
} 

J'envisage d'analyser la sortie de urlifyLinks et d'appliquer la regex à tous les éléments dom qui sont des éléments de texte sur le premier niveau, est qu'une chose laide à faire?

Answer 1

Vous pouvez éviter ce problème en utilisant une seule regex avec un remplacement de la fonction de rappel.

For example:

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