Maison >interface Web >js tutoriel >Comment puis-je détecter et convertir des URL en hyperliens en JavaScript ?

Comment puis-je détecter et convertir des URL en hyperliens en JavaScript ?

Patricia Arquette
Patricia Arquetteoriginal
2024-11-29 07:44:09829parcourir

How Can I Detect and Convert URLs to Hyperlinks in JavaScript?

Détecter les URL dans du texte avec JavaScript

La détection d'URL peut être difficile en raison de la flexibilité du format d'URL. Pour résoudre ce problème, nous créons une fonction personnalisée qui remplace toute URL détectée par un lien hypertexte HTML.

Regex pour la détection d'URL

La recherche d'URL nécessite une expression régulière précise. Bien que le « kLINK_DETECTION_REGEX » fourni soit complet, il peut conduire à des faux positifs. Pour cette démonstration, nous utiliserons l'expression régulière la plus simple : /(https?://1 )/g.

Remplacement de chaîne

Une fois que nous avons une regex, nous pouvons remplacer les URL par des hyperliens en utilisant la méthode replace(). La chaîne de remplacement peut être construite en utilisant la concaténation de chaînes :

return text.replace(urlRegex, '<a href="' + url + '">' + url + '</a>')

Alternativement, nous pouvons utiliser la référence arrière $1 :

return text.replace(urlRegex, '<a href=""></a>')

Exemple d'utilisation

Étant donné le texte saisi : "Trouvez-moi sur http://www.example.com et également sur http://stackoverflow.com', la fonction urlify produira le HTML suivant :

Find me at <a href="http://www.example.com">http://www.example.com</a> and also at <a href="http://stackoverflow.com">http://stackoverflow.com</a>

  1. s

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn