JavaScript: convertire le stringhe in link ai profili di Twitter senza jQuery

JavaScript: convertire le stringhe in link ai profili di Twitter senza jQuery

jQuery tende a farci perdere la capacità di risolvere dei problemi comuni a causa della sua peculiare caratteristica di semplificare gran parte del lavoro sui documenti web. Un tipico esempio è quello della trasformazione di stringhe come @gabromanato in link al corrispondente profilo su Twitter.

La soluzione fa uso delle espressioni regolari combinate con il metodo replace() e la proprietà innerHTML:


(function() {
	
	var autoTwitterUsername = function( element ) {
		var html = element.innerHTML;
		element.innerHTML = html.replace( /([^a-z0-9-_&])@([0-9a-z_]+)/gi, "$1<a href=\"http://twitter.com/$2\" target=\"_blank\" rel=\"nofollow\">@$2</a>" );
	};
	
	document.addEventListener( "DOMContentLoaded", function() {
		var p = document.querySelectorAll( "p" );
		for( var i = 0; i < p.length; ++i ) {
			var para = p[i];
			autoTwitterUsername( para );
		}
		
	});
	
})();

Potete visionare l'esempio di seguito.

See the Pen JavaScript: automatic Twitter links for usernames by Gabriele Romanato (@gabrieleromanato) on CodePen.

Torna su