Comment trouver les liens HTTP dans le courrier HTML en utilisant des expressions régulières en JavaScript

Question

Je travaille sur l'application client de messagerie. Je souhaite afficher tous les liens HTTP sous forme de liens hypertexte cliquables.

J'ai remarqué que certains clients envoient des liens HTTP sans les inclure dans les balises d'ancrage. Dans ce cas, je ne montre pas ces liens comme des liens cliquables. Mon exigence est de trouver tous les liens HTTP dans un courrier HTML et devez remplacer ces liens en les entourant de balises d'ancrage et aussi d'exclure les liens qui sont déjà dans les balises d'ancrage ou dans l'attribut source de n'importe quelle balise.

Ex: Supposons que mon courrier HTML est d'avoir le texte suivant

Input: "http://www.google.com/"  < a href = "http:\\gmail.com"></a> 

Après avoir remplacé que je veux les éléments suivants eteint

Output: <a href = "http://www.google.com"> </a> < a href = "http:\\gmail.com"></a> 

Je pense que je ne peux pas regarder directement pour le modèle qui commence par http ... car il peut aussi venir comme src de n'importe quelle étiquette.

Alors quelqu'un peut me aider à résoudre ces problème

Merci à l'avance

SubBi

Answer 1

Vérifiez ceci:

(function($){ 
    $.fn.hyperlinkRegex = function(regex, target, ismailto) { 
    ismailto = ismailto || false; 
    if(regex == undefined || regex.source == '') { 
     $(this).find('a').each(function(){ 
     $(this).replaceWith($(this).text()); 
     $(this).parent().each(function(){ 
      node = $(this).get(0); 
      if(node.normalize) node.normalize(); 
     }); 
     }); 
    } else { 
     $(this).each(function(){ 
     elt = $(this).get(0) 
     elt.normalize(); 
     $.each($.makeArray(elt.childNodes), function(i, node){ 
      if(node.nodeType == 3) { 
      var searchnode = node 
      while((pos = searchnode.data.search(regex)) >= 0) { 
       match = searchnode.data.slice(pos).match(regex)[0]; 
       if(match.length == 0) break; 
       var anode = document.createElement('a'); 
       var middlebit = searchnode.splitText(pos); 
       var searchnode = middlebit.splitText(match.length); 
       var middleclone = middlebit.cloneNode(true); 
       anode.appendChild(middleclone); 
       if (ismailto == true) { 
       anode.href = "mailto:" + middleclone.nodeValue; 
       } else { 
       anode.href = middleclone.nodeValue; 
       } 
       anode.target = target; 
       searchnode.parentNode.replaceChild(anode, middlebit); 
      } 
      } else { 
      $(node).hyperlinkRegex(regex, target, ismailto); 
      } 
     }) 
     }) 
    } 
    return $(this); 
    } 
})(jQuery); 

Utilisation:

 
// basic links 
var exp = /(\b(https?|ftp|file):\/\/[-A-Z0-9+&@#\/%?=~_|!:,.;]*[-A-Z0-9+&@#\/%=~_|])/ig; 
node.hyperlinkRegex(exp, "_blank", false); 
// email 
exp = /(\b[A-Z0-9._%-]+@[A-Z0-9.-]+\.[A-Z]{2,4}\b)/ig; 
node.hyperlinkRegex(exp, "_blank", true); 

Laissez-moi cela résout votre problème

Answer 2

Je crois que vous ne pouvez pas le faire correctement dans une expression rationnelle; et également, obligatory link. Pourquoi avez-vous envie de le faire avec regexp si vous travaillez en JavaScript? Votre interpréteur est encadré avec le moteur d'analyse HTML archétypal: un navigateur Web. Juste plonger dans DOM et remplacer sur les nœuds de texte. Si vous ne le faites pas dans JS et que le tag est trompeur et que vous ne pouvez pas trouver une bibliothèque d'analyse HTML correcte, alors votre meilleur pari est de diviser la chaîne par des balises, de la remplacer par des éléments non-tag. , puis rejoins, je pense.

Answer 3

Je viens de tester cette expression:

/\s+("http:[^\s]+")\s+/g 

Ceci remplacera chaque URL entre guillemets. Vous pouvez l'utiliser comme ceci:

var string = "\"http://www.google.com/\"  < a href = \"http:\\gmail.com\"></a>" ; //!! the email string you provided 
var replaced = string.replace(/\s+("http:[^\s]+")\s+/g," <a href=$1></a> ") ; 

Autre que cela, ne supporte pas javascript (négatif) dans lookbehind regex dont on aurait besoin d'identifier parfaitement si l'URL a été adaptée dans une balise html ou non.

HTH,

FK