Find and separate links in JavaScript string

Question

I am making a Windows 8 app with HTML + JS and have a field where the user can input some data, when they revisit the page I set a <div> equal to their input. It is possible they may input a URL so I want to convert it to a link. Every example I has read about talks about enclosing it in an tag however when I write the text into the div I use "div.innerText" rather than "div.innerHTML" in case the user wrote incorrect HTML as their data which then causes the app to crash.

Is there anyway I can fail safe against the user entering incorrect HTML and still have hyperlinks in the text?

Maybe look a RegExp (Regular Expressions)

Callum Linington
– Callum Linington

2014-04-26 19:01:19 +00:00
Commented Apr 26, 2014 at 19:01 — Callum Linington
– Callum Linington, Commented Apr 26, 2014 at 19:01

Community · Accepted Answer · 2017-05-23 12:04:00Z

2

You need to escape user data first, then replace URLs with links and use innerHTML property to write data into the element

edited May 23, 2017 at 12:04

CommunityBot

11 silver badge

answered Apr 26, 2014 at 19:20

Lukas Kral

99713 silver badges24 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

rbyrne Over a year ago

Thank you, this is exactly the information I was looking for. I wasnt aware of "escaping user data"

EyasSH · Accepted Answer · 2014-04-26 19:17:00Z

1

You can do this to replace a URL to a link using innerHTML.

    // ... first write to element.innerText if you want to then:
    var url_regex = /(\b(https?|ftp|file):\/\/[\-A-Z0-9+&@#\/%?=~_|!:,.;]*[\-A-Z0-9+&@#\/%=~_|])/ig;
    element.innerHTML = element.innerHTML.replace(url_regex, "<a href=\"$1\">$1</a>");

answered Apr 26, 2014 at 19:17

EyasSH

3,84925 silver badges37 bronze badges

Collectives™ on Stack Overflow

Find and separate links in JavaScript string

2 Answers 2

1 Comment

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related