jQuery如何实现动态加载javascript文件

这篇文章将为大家详细讲解有关jQuery如何实现动态加载javascript文件，小编觉得挺实用的，因此分享给大家做个参考，希望大家阅读完这篇文章后可以有所收获。

成都创新互联-云计算及IDC服务提供商，涵盖公有云、IDC机房租用、四川移动机房托管、等保安全、私有云建设等企业级互联网基础服务，欢迎联系：18982081108

本文实例讲述了jQuery实现动态加载(按需加载)javascript文件的方法。分享给大家供大家参考，具体如下：

为了提高网页程序的性能，在很多情况下javascript 是按需加载，而不是全部写在 <head>里面。利用jQuery可以很方便的实现按需加载js.

$("#load").click(function(){
  $.getScript('helloworld.js', function() {
     $("#content").html('js 加载成功!');
  });
});

当id为“load" 的按钮被点击之后，将会动态加载 helloword.js , 然后就可以执行里面的方法。

<html>
<head>
<script type="text/javascript" src="jquery-1.7.2.min.js"></script>
</head>
<body>
 <h2>利用 jQuery 动态加载 js</h2>
<div id="content"></div>
<br/>
<button id="load">Load JavaScript</button>
<button id="sayHello">Say Hello</button>
<script type="text/javascript">
$("#load").click(function(){
 $.getScript('js-example/helloworld.js', function() {
   $("#content").html('
     Javascript is loaded successful! sayHello() function is loaded!
   ');
 });
});
$("#sayHello").click(function(){
 sayHello();
});
</script>
</body>
</html>

其中 helloworld.js 的代码如下:

function sayHello(){
  alert("Hello ~我是动态加载的!");
}

jquery是什么

jquery是一个简洁而快速的JavaScript库，它具有独特的链式语法和短小清晰的多功能接口、高效灵活的css选择器，并且可对CSS选择器进行扩展、拥有便捷的插件扩展机制和丰富的插件，是继Prototype之后又一个优秀的JavaScript代码库，能够用于简化事件处理、HTML文档遍历、Ajax交互和动画，以便快速开发网站。

关于“jQuery如何实现动态加载javascript文件”这篇文章就分享到这里了，希望以上内容可以对大家有一定的帮助，使各位可以学到更多知识，如果觉得文章不错，请把它分享出去让更多的人看到。

新闻标题：jQuery如何实现动态加载javascript文件
文章链接：https://www.cdcxhl.com/article42/gsgphc.html

成都网站建设公司_创新互联，为您提供定制开发、网站制作、虚拟主机、微信小程序、商城网站、移动网站建设

声明：本网站发布的内容（图片、视频和文字）以用户投稿、用户转载内容为主，如果涉及侵权请尽快告知，我们将会在第一时间删除。文章观点不代表本网站立场，如需处理请联系客服。电话：028-86922220；邮箱：631063699@qq.com。内容未经允许不得转载，或转载时需注明来源：创新互联

猜你还喜欢下面的内容