动态加载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 相关文章推荐
原生Js与jquery的多组处理, 仅展开一个区块的折叠效果
Jan 09 Javascript
Jquery公告滚动+AJAX后台得到数据
Apr 14 Javascript
js禁止页面刷新与后退的方法
Jun 08 Javascript
JSON 的正确用法探讨:Pyhong、MongoDB、JavaScript与Ajax
May 15 Javascript
Bootstrap 最常用的JS插件系列总结(图片轮播、标签切换等)
Jul 14 Javascript
JSON与XML的区别对比及案例应用
Nov 11 Javascript
jQuery实现复选框的全选和反选
Feb 02 Javascript
Angular实现一个简单的多选复选框的弹出框指令实例
Apr 25 Javascript
JavaScript求一组数的最小公倍数和最大公约数常用算法详解【面向对象,回归迭代和循环】
May 07 Javascript
vue 循环加载数据并获取第一条记录的方法
Sep 26 Javascript
node上的redis调用优化示例详解
Oct 30 Javascript
前端框架ECharts dataset对数据可视化的高级管理
Dec 24 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
php计算程序运行时间的简单例子分享
2014/05/10 PHP
PHP实现中文圆形印章特效
2015/06/19 PHP
laravel通过创建自定义artisan make命令来新建类文件详解
2017/08/17 PHP
php tpl模板引擎定义与使用示例
2019/08/09 PHP
Javascript模板技术
2007/04/27 Javascript
用js遍历 table的脚本
2008/07/23 Javascript
jQuery数据缓存用法分析
2015/02/20 Javascript
jQuery实现新消息在网页标题闪烁提示
2015/06/23 Javascript
详解JavaScript表单验证(E-mail 验证)
2016/03/31 Javascript
Jquery插件仿百度搜索关键字自动匹配功能
2016/05/11 Javascript
jQuery.Callbacks()回调函数队列用法详解
2016/06/14 Javascript
Javascript 获取鼠标当前的位置实现方法
2016/10/27 Javascript
利用fecha进行JS日期处理
2016/11/21 Javascript
详解React 在服务端渲染的实现
2017/11/16 Javascript
JS实现统计字符串中字符出现个数及最大个数功能示例
2018/06/04 Javascript
vue+axios实现文件下载及vue中使用axios的实例
2018/09/21 Javascript
vue进入页面时不在顶部,检测滚动返回顶部按钮问题及解决方法
2019/10/30 Javascript
vue 接口请求地址前缀本地开发和线上开发设置方式
2020/08/13 Javascript
[01:05:24]Ti4 冒泡赛第二天 iG vs NEWBEE 3
2014/07/15 DOTA
[49:05]OG vs Newbee 2019DOTA2国际邀请赛淘汰赛 胜者组 BO3 第二场 8.21.mp4
2020/07/19 DOTA
Python实现根据IP地址和子网掩码算出网段的方法
2015/07/30 Python
python密码错误三次锁定(实例讲解)
2017/11/14 Python
Python实现模拟浏览器请求及会话保持操作示例
2018/07/30 Python
Python bisect模块原理及常见实例
2020/06/17 Python
html5新增的定时器requestAnimationFrame实现进度条功能
2018/12/13 HTML / CSS
详解移动端h5页面根据屏幕适配的四种方案
2020/04/15 HTML / CSS
使用C#编写创建一个线程的代码
2013/01/22 面试题
受欢迎的大学生自我评价
2013/12/05 职场文书
工作自荐信
2013/12/11 职场文书
团代会主持词
2014/04/02 职场文书
反四风对照检查材料思想汇报
2014/09/16 职场文书
2014年高校辅导员工作总结
2014/12/09 职场文书
销售助理岗位职责
2015/02/11 职场文书
2015关于重阳节的演讲稿
2015/03/20 职场文书
Redis数据结构之链表与字典的使用
2021/05/11 Redis
MySQL分区表实现按月份归类
2021/11/01 MySQL