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}')

  • 相关阅读:
    eclipse的优化 gc.log
    一次使用Eclipse Memory Analyzer分析Tomcat内存溢出
    JVM系列三:JVM参数设置、分析
    热加载
    彻底理解JAVA动态代理
    Linux下查看Web服务器当前的并发连接数和TCP连接状态
    个人博客 V0.0.3 版本 ...
    HTML5本地存储——IndexedDB(一:基本使用)
    如何在Blog中加入Google Analytics
    webpack中实现按需加载
  • 原文地址:https://www.cnblogs.com/ArthurXml/p/5432530.html
Copyright © 2011-2022 走看看