动态加载jquery库的方法


Posted in Javascript onFebruary 12, 2014

有时候,我们可能不会在网页中<script src="jquery.min.js" 来加载 Jquery 库,可能在用户点击某个按钮后,才去加载 Jquery 库。好处不用我说,节省带宽,提高访问速度,因为用户可能不会点击这个按钮,也就不需要 Jquery 。那么如何动态加载 Jquery 库呢?一般可以用 Document.write 来打印出,也可以用 Ajax ,也可以用我下面的这种方式:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
<html xmlns="http://www.w3.org/1999/xhtml" >  
<head>  
    <title>动态加载Jquery库,不用创建Ajax请求。在 a 的 href 属性中写一段或多段代码</title>  
    <style type="text/css">  
        #message { margin: 20px 10px; color:Green; }  
    </style>  
    <script language="javascript" type="text/javascript">  
        function AjaxLoadJquerylibrary()  
        {  
            var d = document, s = d.getElementById('firebug-lite');  
            if (s != null)  
                return;  
            s = d.createElement('script');  
            s.type = 'text/javascript';  
            s.src = 'http://ajax.googleapis.com/ajax/libs/jquery/1.3.1/jquery.min.js';  
            d.body.appendChild(s);  
            document.getElementById("content").style.display = "block";  
        }  
    </script>  
</head>  
<body>  
<div>  
    <input type="button" value="动态导入Jquery" onclick="AjaxLoadJquerylibrary();" /><br />  
</div>  
<div id="message">  </div>    
 <div id="content">  
    请输入您的名字:<input type="text" value="" id="txtUserName" /><br />  
    <a href="javascript:(function(){ var username = $('#txtUserName').val(); alert(username); })();void(0);">Jquery获取名字</a>  
 </div>  
</body>  
</html>
Javascript 相关文章推荐
“不能执行已释放的Script代码”错误的原因及解决办法
Sep 09 Javascript
基于jQuery的history历史记录插件
Dec 11 Javascript
JavaScript常用对象的方法和属性小结
Jan 24 Javascript
用于deeplink的js方法(判断手机是否安装app)
Apr 02 Javascript
jquery重复提交请求的原因浅析
May 23 Javascript
jQuery解析XML与传统JavaScript方法的差别实例分析
Mar 05 Javascript
JavaScript中Function()函数的使用教程
Jun 04 Javascript
3种js实现string的substring方法
Nov 09 Javascript
Vue实现双向绑定的方法
Dec 22 Javascript
JavaScript原生实现观察者模式的示例
Dec 15 Javascript
VueCli4项目配置反向代理proxy的方法步骤
May 17 Javascript
实例讲解JavaScript 计时事件
Jul 04 Javascript
jquery实现页面图片等比例放大缩小功能
Feb 12 #Javascript
javascript获取web应用根目录的方法
Feb 12 #Javascript
使用javascript控制cookie显示和隐藏背景图
Feb 12 #Javascript
raphael.js绘制中国地图 地图绘制方法
Feb 12 #Javascript
js post提交调用方法
Feb 12 #Javascript
JQuery中操作Css样式的方法
Feb 12 #Javascript
Jquery的Tabs内容轮换效果实现代码,几行搞定
Feb 12 #Javascript
You might like
索尼SONY ICF-7600A(W)电路分析
2021/03/01 无线电
实用函数2
2007/11/08 PHP
php下连接ftp实现文件的上传、下载、删除文件实例代码
2010/06/03 PHP
如何使用Linux的Crontab定时执行PHP脚本的方法
2011/12/19 PHP
php cli配置文件问题分析
2015/10/15 PHP
PHP中使用jQuery+Ajax实现分页查询多功能操作(示例讲解)
2017/09/17 PHP
Laravel框架路由设置与使用示例
2018/06/12 PHP
学习ExtJS accordion布局
2009/10/08 Javascript
ASP.NET jQuery 实例2 (表单中使用回车在TextBox之间向下移动)
2012/01/13 Javascript
JavaScript词法作用域与调用对象深入理解
2012/11/29 Javascript
A标签中通过href和onclick传递的this对象实现思路
2013/04/19 Javascript
jquery解析xml字符串示例分享
2014/03/25 Javascript
jQuery中detach()方法用法实例
2014/12/25 Javascript
Node.js开发之访问Redis数据库教程
2015/01/14 Javascript
js实现的简洁网页滑动tab菜单效果代码
2015/08/24 Javascript
jquery验证邮箱格式并显示提交按钮
2015/11/07 Javascript
快速实现JS图片懒加载(可视区域加载)示例代码
2017/01/04 Javascript
JavaScript 异步调用
2017/10/25 Javascript
关于在vue 中使用百度ueEditor编辑器的方法实例代码
2018/09/14 Javascript
js计算两个时间差 天 时 分 秒 毫秒的代码
2019/05/21 Javascript
vuex实现像调用模板方法一样调用Mutations方法
2019/11/06 Javascript
vue data对象重新赋值无效(未更改)的解决方式
2020/07/24 Javascript
windows 下python+numpy安装实用教程
2017/12/23 Python
Python 数据处理库 pandas进阶教程
2018/04/21 Python
windows下安装Python的XlsxWriter模块方法
2018/05/03 Python
python3.5基于TCP实现文件传输
2020/03/20 Python
Python logging设置和logger解析
2019/08/28 Python
基于HTML5+tracking.js实现刷脸支付功能
2020/04/16 HTML / CSS
美国亚马逊旗下时尚女装网店:SHOPBOP(支持中文)
2020/10/17 全球购物
室内设计自我鉴定
2013/10/15 职场文书
中专生自荐信
2014/06/25 职场文书
关于教师节的演讲稿
2014/09/04 职场文书
个园导游词
2015/02/04 职场文书
清洁工工作总结
2015/08/11 职场文书
python 实现的截屏工具
2021/05/08 Python
MySQL多表查询机制
2022/03/17 MySQL