Beginner
Link only to safe websites
Users type a website into their profile. Render each user's website inside their <li> like this:
If the value parses as an absolute URL (new URL(value)) with the protocol https: or http:, render a link <a> with that URL as href, target="_blank" and rel="noopener noreferrer", showing the URL's hostname as its text.
Otherwise (other schemes like javascript: or data:, or text that isn't a URL), render the original text in a <span> with no link.
What Check tests
- Only the two http(s) websites are links
- Their
hrefs are the real URLs - Links show the hostname
- Links open in a new tab safely
- Unsafe or invalid values are plain text in a
<span>
Stuck? One hint at a time
The solution unlocks after your first Check. Try first: that is where the learning happens.
Runs in your browser. Your code is saved here.
Your page
Press Run to see the page.
Console
Nothing logged yet.