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 相关文章推荐
js 有框架页面跳转(target)三种情况下的应用
Apr 09 Javascript
JavaScript根据数据生成百分比图和柱状图的实例代码
Jul 14 Javascript
JavaScript实现同步于本地时间的动态时间显示方法
Feb 02 Javascript
JQuery跳出each循环的方法
Apr 16 Javascript
JavaScript改变CSS样式的方法汇总
May 07 Javascript
jQuery拖动布局其结果保存到数据库
Oct 09 Javascript
JavaScript数组的定义及数字操作技巧
Jun 06 Javascript
微信小程序之获取当前位置经纬度以及地图显示详解
May 09 Javascript
jquery手机触屏滑动拼音字母城市选择器的实例代码
Dec 11 jQuery
jQuery+css last-child实现选择最后一个子元素操作示例
Dec 10 jQuery
JavaScript常见鼠标事件与用法分析
Jan 03 Javascript
详解JavaScript 的变量
Mar 08 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
PHP经典的给图片加水印程序
2006/12/06 PHP
PHP 表单提交给自己
2008/07/24 PHP
javascript面向对象入门基础详细介绍
2012/09/05 Javascript
jQuery操作Select选择的Text和Value(获取/设置/添加/删除)
2013/03/06 Javascript
js禁止页面使用右键(简单示例代码)
2013/11/13 Javascript
jquery判断元素是否隐藏的多种方法
2014/05/06 Javascript
javascript和jquery实现设置和移除文本框默认值效果代码
2015/01/13 Javascript
JavaScript数组随机排列实现随机洗牌功能
2015/03/19 Javascript
jquery判断至少有一个checkbox被选中的方法
2015/06/05 Javascript
javascript中的altKey 和 Event属性大全
2015/11/06 Javascript
javascript获取系统当前时间的方法
2015/11/19 Javascript
超详细的javascript数组方法汇总
2015/11/21 Javascript
理解JS绑定事件
2016/01/19 Javascript
JS中使用mailto实现将用户在网页中输入的内容传递到本地邮件客户端
2016/10/08 Javascript
jquery Easyui Datagrid实现批量操作(编辑,删除,添加)
2017/02/20 Javascript
Bootstrap显示与隐藏简单实现代码
2017/03/06 Javascript
vue中如何引入jQuery和Bootstrap
2017/04/10 jQuery
JS设置随机出现2个数字的实例代码
2017/07/19 Javascript
jQuery使用zTree插件实现可拖拽的树示例
2017/09/23 jQuery
vue2.0 路由模式mode=&quot;history&quot;的作用
2018/10/18 Javascript
jQuery Ajax实现Select多级关联动态绑定数据的实例代码
2018/10/26 jQuery
python实现监控linux性能及进程消耗性能的方法
2014/07/25 Python
Python的Flask框架中@app.route的用法教程
2015/03/31 Python
浅谈Python浅拷贝、深拷贝及引用机制
2016/12/15 Python
python傅里叶变换FFT绘制频谱图
2019/07/19 Python
TensorFlow2.X结合OpenCV 实现手势识别功能
2020/04/08 Python
python 实现简单的计算器(gui界面)
2020/11/11 Python
纯CSS实现聊天框小尖角、气泡效果
2014/04/04 HTML / CSS
详解如何使用CSS3中的结构伪类选择器和伪元素选择器
2020/01/06 HTML / CSS
国际奢侈品品牌童装购物网站:Designer Childrenswear
2019/05/08 全球购物
爱尔兰电脑、家电和家具购物网站:Buy It Direct
2019/07/09 全球购物
C# .NET面试题
2015/11/28 面试题
入党积极分子学习优秀共产党员先进事迹思想汇报
2014/09/13 职场文书
群众路线剖析材料范文
2014/10/09 职场文书
详细了解MVC+proxy
2021/07/09 Java/Android
Python基础 括号()[]{}的详解
2021/11/07 Python