动态加载JS文件的三种方法

  直接看实例。

  例1 重新加载js文件

  

复制代码 代码如下:

  function loadJs(file) {

  var head = $("head").remove("script[role='reload']");

  $("<scri" + "pt>" + "</scr" + "ipt>").attr({ role: 'reload', src: file, type: 'text/javascript' }).appendTo(head);

  }

  例2 重新载入javascript文件的方法(给js定个id),自己封装成一个方法方便大家使用:

  

复制代码 代码如下:

  function reloadAbleJSFn(id,newJS)

  {

  var oldjs = null;

  var t = null;

  var oldjs = document.getElementById(id);

  if(oldjs) oldjs.parentNode.removeChild(oldjs);

  var scriptObj = document.createElement("script");

  scriptObj.src = newJS;

  scriptObj.type = "text/javascript";

  scriptObj.id   = id;

  document.getElementsByTagName("head")[0].appendChild(scriptObj);

  }

  例3 jquery的就直接使用getScript就可以了。

  

复制代码 代码如下:

  <script type="text/javascript" src="../jquery.js"></script>

  <script type="text/javascript">

  $(function()

  {

  $('#loadButton').click(function(){

  $.getScript('new.js',function(){

  newFun('"Checking new script"');//这个函数是在new.js里面的,当点击click后运行这个函数

  });

  });

  });

  </script>

  </head>

  <body>

  <button type="button" id="loadButton">Load</button>