Código JavaScript para visualizar lo que programas

Buenas, si alguna vez han tenido la necesidad de ver el resultado de lo que programan, este tutorial le podra ayudar a hacerlo. Para esto, vamos ver como crear un codigo javascript para visualizar lo que programas en tiempo real.

Este codigo javacript, va a estar diseñado con puro javascript. Esto significa que podran utilizarlo en cualquier pagina, sin la necesidad de una libreria extra.

<script>
        /**
         * Adding initial url path to have the option of testing links and images without damaging the original code.
         * Create by Maikel Urquijo
         * @url https://github.com/M1k3xUr
         */
        const lnk = "https://yoururl.com",
            tl = ['source', 'img', 'video', 'a', 'link'];
        document.onreadystatechange = () => {
            if (document.readyState === "complete") {
                tl.forEach(ex => {
                    tagLinks(ex);
                });
            }
        };
        /*media images tag*/
        function tagLinks(theTag){                
            let theBigTag = document.querySelectorAll(theTag);
            theBigTag.forEach(el => {
                switch (theTag) {
                    case 'source':
                        el.setAttribute('srcset', lnk + el.getAttribute('srcset'));
                        break;
                    case 'img':
                    case 'video':
                        el.setAttribute('src', lnk + el.getAttribute('src'));
                        if(el.hasAttribute('poster')){
                            el.setAttribute('poster', lnk + el.getAttribute('poster'));
                        }
                        break;                    
                    case 'a':
                    case 'link':
                        el.setAttribute('href', lnk + el.getAttribute('href'));
                        el.setAttribute('target', '_blank');
                        break;
                
                    default:
                        break;
                }
            });
        }
    </script>