Ładowanie kodu JS na podstawie zdarzenia "resize"

Question

Witam,
Napotkałem mały problem z ładowaniem skryptów dla odpowiednich szerokości ekranów.
 

function addScriptToPage (uri) {
            var script = document.createElement("SCRIPT");
            script.type = "text/javascript";
            script.async = true;
            script.src = uri;

            document.getElementsByTagName("head")[0].appendChild(script);
        }
        
        
        function checkWidthScreen () {
            var widthScreen = document.documentElement.offsetWidth,
                elementsArr = document.querySelectorAll("head script");
           
            if (widthScreen >= 650) {
                 elementsArr[1].setAttribute("src", "script_for_computer.js");
                 elementsArr[2].setAttribute("src", "")
            }
            else {
                 elementsArr[1].setAttribute("src", "script_for_screen.js");
                 elementsArr[2].setAttribute("src", "");
                
                 if(widthScreen < 479){
                     elementsArr[2].setAttribute("src", "script_for_min_screen.js");
                }
            }
        }
        
     
        
        document.addEventListener("DOMContentLoaded", function() {
    
            addScriptToPage("all_script.js");
            addScriptToPage("");
            addScriptToPage("");
            
            window.addEventListener("resize", checkWidthScreen, false);

            
        })

Kod w sumie działa, bo podczas zmiany szerokości funkcja setAttribute działa jak powinna, ale mimo to przeglądarka nie wczytuje tych skryptów i nie działają z nich odpowiednie funkcje. Popełniłem gdzieś mały błąd, czy raczej cały kod jest w tym przypadku błędny, a takie dodawanie skryptów robi się inaczej?

Answer 1

Dobra, rozwiązałem problem. W tym przypadku setAttribute to zły pomysł.
Jakby kogoś interesowało to kod wygląda teraz tak:

function addScriptToPage (uri) {
            var script = document.createElement("SCRIPT");
            script.type = "text/javascript";
            script.async = true;
            script.src = uri;

            document.getElementsByTagName("head")[0].appendChild(script);
        }
        
        
        function checkWidthScreen () {
            var widthScreen = document.documentElement.offsetWidth,
                elementsArr = document.querySelectorAll("head script"),
                headElement = document.getElementsByTagName("head")[0];
           
            if (widthScreen >= 650) {
                headElement.removeChild(elementsArr[1]);
                addScriptToPage("script_for_computer.js");
            }
            else {
                headElement.removeChild(elementsArr[1]);
                addScriptToPage("script_for_screen.js");
            }
        }
        
     
        
        document.addEventListener("DOMContentLoaded", function() {
    
            addScriptToPage("all_script.js");
            addScriptToPage("");
            
            
            window.addEventListener("resize", checkWidthScreen, false);

            
        })