how to edit this regx to detect full url

Question

I am really new to Regex. almost know nothing. but I know js a bit. I need to detect url in my website. This regx is great one i found.

/((http|ftp|https):\/\/)?(([\w.-]*)\.([\w]*))/g

But the issue is it only select part of url. I want to edit it so it select the whole link. check this link: https://regex101.com/r/B5hYwv/2

check image

// [EDITOR MADE THESE CHANGES]
//this code makes all urls clickable 
const re = /((http|ftp|https)\:\/\/)?([\w_-]+(?:(?:\.[\w_-]+)+))([\w.,@?^=%&:/~+#-]*[\w@?^=%&/~+#-])?/g;
let text = document.getElementById("links").textContent;
const matches = text.match(re)
console.log(matches)
for (let i = matches.length - 1; i > 0; i--) {
  text = text.replace(matches[i], `<a href='${matches[i]}'>${matches[i]}</a>`);
}
document.getElementById("links").innerHTML = text;

<div id="links">
  Hello www.google.com World http://yahoo.com Here are some links https://www.google.com.tr/admin/subPage?qs1=sss1&qs2=sss2&qs3=sss3#Services https://google.com.tr/test/subPage?qs1=sss1&qs2=sss2&qs3=sss3#Services I want them to be converted to anchor tags
  http://google.com/test/subPage?qs1=sss1&qs2=sss2&qs3=sss3#Services ftp://google.com/test/subPage?qs1=sss1&qs2=sss2&qs3=sss3#Services www.google.com.tr/test/subPage?qs1=sss1&qs2=sss2&qs3=sss3#Services www.google.com/test/subPage?qs1=sss1&qs2=sss2&qs3=sss3#Services
  drive.google.com/test/subPage?qs1=sss1&qs2=sss2&qs3=sss3#Services

</div>

I am making js which convert all links to clickable url: this is the JS i am using https://prnt.sc/szxoze i am using your regex in my website. I want to make all urls clickable. but with your regex output is https://prnt.sc/szxpwb without js , my website is like this https://prnt.sc/szxqmy — shpathuala, Jun 15 '20 at 08:45
//this code makes all urls clickable var exp = /((http|ftp|https)\:\/\/)?([\w_-]+(?:(?:\.[\w_-]+)+))([\w.,@?^=%&:/~+#-]*[\w@?^=%&/~+#-])?/g var x =document.getElementById('msgContent').innerHTML.replace(exp,"$1"); document.getElementById('msgContent').innerHTML = x ; — shpathuala, Jun 15 '20 at 08:51
Please update the QUESTION with a [mcve] using the `[<>]` stack snippet editor and include example of actual text/HTML and the expected result — mplungjan, Jun 15 '20 at 08:51
https://prnt.sc/szxupw I understand the issue now, I am using $1 , but seems like the regex output is different. is there a way to output whole url as $1 ? I am really sorry I do not have time to study regex write now, it also confusing , really hard to understand since all are mix of characters — shpathuala, Jun 15 '20 at 08:53
UPDATE THE QUESTION PLEASE!!! I need to see your HTML/Text and not GUESS — mplungjan, Jun 15 '20 at 08:54
Click edit, then scroll down, click "edit above snippet" and add relevant HTML/text — mplungjan, Jun 15 '20 at 09:04
That is NOT an example of your string. That is just an example of your regex test. If we could see where the URLs would be sitting, we could make a DOM parsing answer instead of innerHTML processing — mplungjan, Jun 15 '20 at 09:44
it is my website. I have not finished well yet. however if you can help me to figure converts urls in this string I added in code, then I can handle the rest my self. — shpathuala, Jun 15 '20 at 10:06
See the changes I made to your code. Feel free to delete afterwards — mplungjan, Jun 15 '20 at 10:17

how to edit this regx to detect full url

0 Answers0