JSFiddle - React, Tailwind, and code Playground

by estelle

HTML

<a href=http://github.com>GitHub</a>
<a href=http://css-tricks.com>CSS-Tricks</a>
<a href=http://www.google.com>Google</a>
<a href=http://jsfiddle.net/estelle/WTAr9/209/>JSfiddle</a>
<a href=http://www.google.com:80>Google</a>
<a href=http://doesnotexistsreallyreallyreally.com>Nope</a>
<a href=http://127.0.0.1>localhost</a>

CSS

/*
Orig via http://jsfiddle.net/csswizardry/yqdFe/
*/

a { display: block; text-decoration: none; padding: 5px 20px; background-repeat: no-repeat; background-position: left; center;}

JavaScript

var links = document.querySelectorAll("a[href^='http']"), i;

for (i=0; i<links.length; i++){
    links[i].style.backgroundImage = "url(http://g.etfv.co/" + links[i].getAttribute('href') +")";
}