JavaScript: sostituire gli iframe di YouTube e Vimeo con link HTML

Gli iframe di YouTube e Vimeo possono essere sostituiti con link HTML tramite JavaScript.

La soluzione è la seguente:

function Replacer() {
	this.iframe = document.querySelectorAll( "iframe" );
	if( this.iframe.length > 0 ) {
		this.init();
	}
}

Replacer.prototype = {
	init: function() {
		var self = this;
		for( var i = 0; i < self.iframe.length; ++i ) {
			var el = self.iframe[i];
			var src = el.getAttribute( "src" );
			var title = "Video";
			var link = document.createElement( "a" );
			link.className = "video-link";
			link.innerHTML = title;
			var regExp = /^.*((youtu.be\/)|(v\/)|(\/u\/\w\/)|(embed\/)|(watch\?))\??v?=?([^#\&\?]*).*/;
			if( regExp.test( src ) ) {
				var match = src.match( regExp );
				var ytlink = "https://youtu.be/" + match[7];
				link.setAttribute( "href", ytlink );
			} else if( /vimeo/.test( src ) ) {
				var vimeo = src.match( /\d+/ );
				var vimeoLink = "https://vimeo.com/" + vimeo[0];
				link.setAttribute( "href", vimeoLink );
			}

			el.parentNode.replaceChild( link, el );
		}
	}
};

Esempio d'uso:

document.addEventListener( "DOMContentLoaded", function() {
	var replacerInstance = new Replacer();
});