gogogo
管理员
管理员
  • UID25
  • 粉丝0
  • 关注0
  • 发帖数1384
阅读:6384回复:1

jquery动态加载外部js文件代码研究

楼主#
更多 发布于:2019-10-22 16:35

$.getScript函数动态加载js

有时网页上的js过多就会让网页加载太慢,用户体验不好,我们可以使用jquery $.getScript函数动态加载我们需要的js文件

代码如下

当点击 id为load的元素时就会加载helloworld.js这个文件

$("#load").click(function(){

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

    $("#content").html('Javascript is loaded successful!');

 });

});

js 加载外部js文件研

第1种:用传统的document.write()来加载,这里</script>里须注意用“”转义字符;

代码如下

document.write("<script type='text/javascript' src='test.js'></script>");

第2种:动态的创建一个script标签,然后给script元素添加src属性指向需要加载的js文件,最后用appendChild()方法把script元素添加到head里。

var oHead = document.getElementsByTagName("head")[0];

var oScript = document.createElement("script"); oScript.src = "test.js";

oHead.appendChild(oScript);

这两种方式都可以顺利的加载外部JS文件,但都有一个缺点,即在JS文件加载完毕之前都无法获取外部JS文件里定义的变量或函数,

gogogo
管理员
管理员
  • UID25
  • 粉丝0
  • 关注0
  • 发帖数1384
沙发#
发布于:2019-10-22 16:37
游客


返回顶部