zoukankan      html  css  js  c++  java
  • 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}')

  • 相关阅读:
    我不喜欢的 Rust 特性 (之一) eager drop
    为 Windows Phone 8.1 app 解决“The type does not support direct content.”的问题
    输入10个互不相同的数字并分成5对,问有多少种分法。
    code wars quiz: toInteger
    my first emacs custom key binding
    http协议消息报头学习笔记
    移动端经常遇到的小bug
    js小技巧
    ajax
    js正则表达
  • 原文地址:https://www.cnblogs.com/ArthurXml/p/5432530.html
Copyright © 2011-2022 走看看