• [转]动态加载、移除、替换JS和CSS


    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
    <HTML>
     <HEAD>
      <TITLE> New Document </TITLE>
      <META NAME="Generator" CONTENT="EditPlus">
      <META NAME="Author" CONTENT="">
      <META NAME="Keywords" CONTENT="">
      <META NAME="Description" CONTENT="">
      <script>
      function include_js(file) {  
      var _doc = document.getElementsByTagName('head')[0];   
      var js = document.createElement('script');
      js.setAttribute('type', 'text/javascript');   
      js.setAttribute('src', file);   
      _doc.appendChild(js);   

      var css = document.createElement('link');
      css.setAttribute('rel', 'stylesheet');
      css.setAttribute('type', 'text/css'); 
      css.setAttribute('href', "http://192.192.187.233/ss/css/css.css");

      _doc.appendChild(css);

      if (!/*@cc_on!@*/0) { //if not IE        //Firefox2、Firefox3、Safari3.1+、Opera9.6+ support js.onload      
     js.onload = function () {           
     alert('Firefox2、Firefox3、Safari3.1+、Opera9.6+ support js.onload');        }    } else {        //IE6、IE7 support js.onreadystatechange       
     js.onreadystatechange = function () {           
     if (js.readyState == 'loaded' || js.readyState == 'complete') {               
     alert('IE6、IE7 support js.onreadystatechange');            }        }    }    return false;}//execution function
     
     include_js('http://www.planabc.net/wp-includes/js/jquery/jquery.js');
      </script>
     </HEAD>
     <BODY> 
     </BODY>
    </HTML>





    动态加载、移除、替换js/css文件(转载)

    <script language="javascript">
    //动态加载一个js/css文件
    function loadjscssfile(filename, filetype){
    if (filetype=="js"){
    var fileref=document.createElement('script')
    fileref.setAttribute("type","text/javascript")
    fileref.setAttribute("src", filename)
    }
    else if (filetype=="css"){
    var fileref=document.createElement("link")
    fileref.setAttribute("rel", "stylesheet")
    fileref.setAttribute("type", "text/css")
    fileref.setAttribute("href", filename)
    }
    if (typeof fileref!="undefined")
    document.getElementsByTagName("head")[0].appendChild(fileref)
    }

    </script>
    使用示例:
    loadjscssfile("myscript.js", "js")
    loadjscssfile("javascript.php", "js")
    loadjscssfile("mystyle.css", "css")




    <script language="javascript">
    //移动已经加载过的js/css
    function removejscssfile(filename, filetype){
    var targetelement=(filetype=="js")? "script" : (filetype=="css")? "link" : "none"
    var targetattr=(filetype=="js")? "src" : (filetype=="css")? "href" : "none"
    var allsuspects=document.getElementsByTagName(targetelement)
    for (var i=allsuspects.length; i>=0; i--){
    if (allsuspects[i] && allsuspects[i].getAttribute(targetattr)!=null && allsuspects[i].getAttribute(targetattr).indexOf(filename)!=-1)
       allsuspects[i].parentNode.removeChild(allsuspects[i])
    }
    }

    </script>

    使用示例:
    removejscssfile("somescript.js", "js")
    removejscssfile("somestyle.css", "css")




    还不止这些,我们还可以替换已经加载的js/css文件,代码如下:
    <script language="javascript">
    function createjscssfile(filename, filetype){
    if (filetype=="js"){
    var fileref=document.createElement('script')
    fileref.setAttribute("type","text/javascript")
    fileref.setAttribute("src", filename)
    }
    else if (filetype=="css"){
    var fileref=document.createElement("link")
    fileref.setAttribute("rel", "stylesheet")
    fileref.setAttribute("type", "text/css")
    fileref.setAttribute("href", filename)
    }
    return fileref
    }

    function replacejscssfile(oldfilename, newfilename, filetype){
    var targetelement=(filetype=="js")? "script" : (filetype=="css")? "link" : "none"
    var targetattr=(filetype=="js")? "src" : (filetype=="css")? "href" : "none"
    var allsuspects=document.getElementsByTagName(targetelement)
    for (var i=allsuspects.length; i>=0; i--){
    if (allsuspects[i] && allsuspects[i].getAttribute(targetattr)!=null && allsuspects[i].getAttribute(targetattr).indexOf(oldfilename)!=-1){
       var newelement=createjscssfile(newfilename, filetype)
       allsuspects[i].parentNode.replaceChild(newelement, allsuspects[i])
    }
    }
    }

    </script>

    使用示例:
    replacejscssfile("oldscript.js", "newscript.js", "js")
    replacejscssfile("oldstyle.css", "newstyle", "css")


    尊重源作者权益将原文地址附上:

    http://www.javascriptkit.com/javatutors/loadjavascriptcss.shtml
    http://www.javascriptkit.com/javatutors/loadjavascriptcss2.shtml

  • 相关阅读:
    JNI 反射
    JNI 动态注册
    Nt* 与 Zw* 区别
    python之线程
    爬虫框架之Scrapy(四 ImagePipeline)
    初试PySnooper
    爬虫框架之Scrapy(三 CrawlSpider)
    爬虫框架之Scrapy(二)
    爬虫框架之Scrapy(一)
    selenium+谷歌无头浏览器爬取网易新闻国内板块
  • 原文地址:https://www.cnblogs.com/xjyggd/p/1383592.html
Copyright © 2020-2023  润新知