DOM动态加载脚本或者css

使用<script>元素可以向页面中插入javascript代码有两种方式：
    1，通过其src特性包含外部文件
        var script=document.createElement('script');
        script.type='text/javascript';
        script.src='test.js';
        document.body.appendChild(script);
        在执行最后一行代码把<script>元素添加到页面之前，是不会下载外部文件的
      但是如何来确定脚本加载完毕呢？
        EventUtil.addHandler(window, 'load', function() {
            var script = document.createElement('script');
            EventUtil.addHandler(script, 'load', function(event) { // IE8 及更早版本不支持该事件
              //1, event 指向的是script ;2,脚本已经执行完毕
                alert('loaded');
            });
            script.type = 'text/javascript';
            script.src = 'test.js';
            document.body.appendChild(script);
        });
    2，用这个元素本身来包含代码行内方式
        var script = document.createElement('script');
        script.type = 'text/javascript';
        var code='function aaa(){alert(1);} aaa()';
        try{
        script.appendChild(document.createTextNode('function aaa(){alert(1);} aaa()')); //IE不支持
        }
        catch{
        script.text=code; //Safari3之前不支持
        }
        document.body.appendChild(script);
类似的外部css样式文件也可以这样两种情况加载（style.stylesheet.cssText='body{background-color:red}'）

来源：https://www.cnblogs.com/ArthurXml/p/5432530.html

标签

脚本

javascript

css

dom