JQuery 学习笔记01 JQuery初接触


Posted in Javascript onMay 06, 2010

一、下载
官方网址是http://jquery.com/
官方下载地址:http://docs.jquery.com/Downloading_jQuery
里边有当前版本和历史版本的下载,可以下载下来部署在自己的服务器上
上面也有Google\Microsoft\jQuery的CDN(Content Delivery Network)地址,由于目前jQuery的广泛使用,选择CDN地址可以充分利用缓存和这些互联网大佬们的带宽和服务器资源。
官网上下载有两种版本Compressed(Minified version)和Uncompressed(Source version)
前者体积小70k左右,还不到未压缩版本的一半大小。
但是未压缩版本更容易阅读源代码,以及调试
二、安装
安装jQuery非常简单 只需在HTML中引用你下载的那个js文件即可
比如     <script type="text/javascript" src="/jslibs/jquery.min.js"></script>
如果使用CDN 就直接引用<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
三、第一个程序

<!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></title> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> 
<script type="text/javascript"> 
$(function() { alert("hello"); }) 
</script> 
</head> 
<body> 
</body> 
</html>

刷新页面后 就可以执行了。
刚开始可能对$有点不适应,其实用不了多久就会习惯,并且喜欢它的简洁。如果实在吃不消,“$”也可以用“jQuery”代替

$(function() { alert("hello"); })

相当于
$(document).ready(function() { alert("hello"); })

也基本相当于

document.onready = function() {alert("hello");}

也就是说当浏览器把文档结构完全解析后,就可以执行下面的语句了。
与document.onload的区别在于,onload不但需要解析完文档结构,还要等待所有需要加载的内容加载完毕(比如图片等)
因为$(document).ready(fn)的频繁使用,所以可以简化为$(fn)

Javascript 相关文章推荐
动态调用CSS文件的JS代码
Jul 29 Javascript
node.js中的fs.readdirSync方法使用说明
Dec 17 Javascript
异步JS框架的作用以及实现方法
Oct 29 Javascript
JavaScript构造函数详解
Dec 27 Javascript
JavaScript的设计模式经典之代理模式
Feb 24 Javascript
jQuery事件委托之Safari
Jul 05 Javascript
Vue.js创建Calendar日历效果
Nov 03 Javascript
如何解决hover在ie6中的兼容性问题
Dec 15 Javascript
原生JS实现跑马灯效果
Feb 20 Javascript
Js实现京东无延迟菜单效果实例(demo)
Jun 02 Javascript
JavaScript 上传文件(psd,压缩包等),图片,视频的实现方法
Jun 19 Javascript
解决VUE框架 导致绑定事件的阻止冒泡失效问题
Feb 24 Javascript
Jquery 扩展方法
May 06 #Javascript
javascript 获取页面的高度及滚动条的位置的代码
May 06 #Javascript
屏蔽F1~F12的快捷键的js函数
May 06 #Javascript
MC Dialog js弹出层 完美兼容多浏览器(5.6更新)
May 06 #Javascript
picChange 图片切换特效的函数代码
May 06 #Javascript
JS 自定义函数缺省值的设置方法
May 05 #Javascript
JSQL 批量图片切换的实现代码
May 05 #Javascript
You might like
ADODB的数据库封包程序库
2006/12/31 PHP
PHP 网页过期时间的控制代码
2009/06/29 PHP
PHP测试程序运行时间的类
2012/02/05 PHP
WordPress中设置Post Type自定义文章类型的实例教程
2016/05/10 PHP
浅析PHP7新功能及语法变化总结
2016/06/17 PHP
Yii框架数据库查询、增加、删除操作示例
2019/10/14 PHP
javascript 学习之旅 (3)
2009/02/05 Javascript
JavaScript高级程序设计(第3版)学习笔记11 内建js对象
2012/10/11 Javascript
Javascript中Event属性搜集整理
2013/09/17 Javascript
Javascript弹出窗口的各种方法总结
2013/11/11 Javascript
jquery创建表格(自动增加表格)代码分享
2013/12/25 Javascript
jQuery+canvas实现的球体平抛及颜色动态变换效果
2016/01/28 Javascript
Node.js DES加密的简单实现
2016/07/07 Javascript
浅谈angular4实际项目搭建总结
2017/12/01 Javascript
JavaScript中Object值合并方法详解
2017/12/22 Javascript
200行代码实现blockchain 区块链实例详解
2018/03/14 Javascript
使用pm2部署node生产环境的方法步骤
2019/03/09 Javascript
nodejs微信开发之接入指南
2019/03/17 NodeJs
js+canvas绘制图形验证码
2020/09/21 Javascript
基于VUE实现简单的学生信息管理系统
2021/01/13 Vue.js
[01:00:06]加油DOTA_EP01_网络版
2014/08/09 DOTA
讲解Python中的递归函数
2015/04/27 Python
python中ASCII码字符与int之间的转换方法
2018/07/09 Python
深入解析python中的实例方法、类方法和静态方法
2019/03/11 Python
python买卖股票的最佳时机(基于贪心/蛮力算法)
2019/07/05 Python
在Django的View中使用asyncio的方法
2019/07/12 Python
python字典的setdefault的巧妙用法
2019/08/07 Python
python爬虫 批量下载zabbix文档代码实例
2019/08/21 Python
python制作英语翻译小工具代码实例
2019/09/09 Python
三步解决python PermissionError: [WinError 5]拒绝访问的情况
2020/04/22 Python
加拿大领先家居家具网上购物:Aosom.ca
2020/05/27 全球购物
环卫工人先进事迹材料
2014/06/02 职场文书
2014年招商工作总结
2014/11/22 职场文书
2015年酒店销售部工作总结
2015/07/24 职场文书
部门主管竞聘书
2015/09/15 职场文书
Java实现聊天机器人完善版
2021/07/04 Java/Android