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