Regex match url without tag - JS

Question

I am looking for a regex expression in JavaScript for the same use case as this post here: regex matching links without <a> tag

My goal is to transform a string such as

Here is a link https://www.somewebsite.com/ here is a link already in an a tag <a href="https://www.somewebsite.com/">https://www.somewebsite.com/</a>

To

Here is a link <a href="https://www.somewebsite.com/">https://www.somewebsite.com/</a> here is a link already in an a tag <a href="https://www.somewebsite.com/">https://www.somewebsite.com/</a>

There are many regex examples for a url, but I am not sure how to add an "and" condition for the url match not being in an <a> tag. I have only found examples so far for php or python, but not JS.

Thank you!

https://stackoverflow.com/questions/37684/how-to-replace-plain-urls-with-links — epascarello, Jul 23 '18 at 17:37
This is an example why parsing HTML with reg exp is a bad idea. — epascarello, Jul 23 '18 at 17:37
"I am not sure how to `add` an and condition" - you could use a negitive look ahead to confirm that the matched pattern (the link) in not followed by a `` tag. Another approach would be to use a negated character set to tell the regex engine to match everything until a `<` is encountered. — Wololo, Jul 23 '18 at 17:52

score 2 · Accepted Answer · answered Jul 23 '18 at 18:28

Instead of using regex, you can test the URL that was supplied to see if it is treated as an external resource. Here, I split the string by whitespace, then tested each part to see if it is a defined URL.

const string = `Here is a link https://www.somewebsite.com/ here is a link already in an a tag <a href="https://www.somewebsite.com/">https://www.somewebsite.com/</a>`;

const newString = string
  .split(/\s+/)
  .map(string => (isDefinedUrl(string)) ? makeUrl(string) : string)
  .join(' ');

console.log(newString);


function isDefinedUrl(possibleUrl) {
  const a = document.createElement('a');
  a.href = possibleUrl;
  return (possibleUrl === a.href);
}

function makeUrl(url) {
  return `<a href="${url}">${url}</a>`;
}

very clever, but then you are stuck if a hyperlink is not surrounded with spaces, like `this link (https://example.com)`... What could be other valid separators? — sritmak, Nov 21 '22 at 12:25

Regex match url without tag - JS

1 Answers1