锋利的jquery学习

有道云笔记无法复制图片到博客，可点击链接查看详细笔记：

锋利的jquery学习

第一章认识jQuery
1.1 JavaScript 和 JavaScript 库
js库：
Prototype
Dojo
Ext JS
MooTools
jQuery ：强大的选择器，出色的DOM操作，可靠的事件处理、完善的兼容性和链式操作等功能。write less， do more！
1.2.2 jQuery 的优势：
1.轻量级
2.强大的选择器
3.出色的DOM操作的封装
4.可靠的事件处理机制
5.完善的Ajax
6.不污染顶级变量
7.出色的浏览器兼容性
8.链式操作方式
9.隐式迭代
10.行为层与结构层的分离
11.丰富的插件支持
12.完善的文档
13.开源
window.onload 与 $(document).ready()对比：

1.链式操作风格：调整代码风格

为代码添加注释：

1.4 jQuery对象和DOM对象

DOM对象：（Document Object Model, 文档对象模型）
jQuery对象：通过jQuery包装DOM对象后产生的对象

jQuery 对象和DOM对象的互相转换：

1.jQuery 对象转为 DOM对象：[index]和get(index)

2.DOM对象转为 jQuery对象：用$()把DOM对象包装起来即可

1.5 解决jQuery和其它库的冲突

jQuery库在其它库之后导入：
jQuery 库在其他库之前导入：

1.6 jQuery 开发工具和插件：

Dreamweaver
2.Aptana
3.jQueryWTP 和 Spket 可以使eclipse支持自动提示代码功能。
4.Visual Studio 2008
1.7 小结：

第2章 jQuery 选择器
2.1 选择器是什么？

jQuery 选择器：

2.2 jQuery 选择器的优势
1.写法简洁
2. 支持css1 到 css3 选择器
3.完善的处理机制

2.3 jQuery 选择器
2.3.1 基本选择器

2.3.2 层次选择器

$(“a b”) 选中a内部所有的b元素，包含子元素及孙子元素等所有下层元素。
$(“a > b”)选中a下所有的子元素b。

2.3.3 过滤选择器
分为基本过滤、内容过滤、可见性过滤、属性过滤、子元素过滤和表单对象属性过滤选择器。
1.基本过滤选择器

内容过滤选择器
可见性过滤选择器：根据元素的可见喝不可见性状态来选择相应的元素
属性过滤选择器
子元素过滤选择器
表单对象属性过滤选择器：

2.3.4 表单选择器

2.4 应用jQuery改写示例

2.5 选择器中的一些注意事项
2.5.1 含有特殊符号

2.5.2 选择器中含有空格

带空格，选择class为“test”的元素里面的隐藏元素。
不带，选择隐藏的class为“test”的元素。
2.6 案例
2.7 其它选择器
2.8 小结

第3章 jQuery中的DOM操作

3.1 DOM 操作的分类：DOM Core（核心）、HTML-DOM、CSS-DOM

DOM Core
HTML-DOM
CSS_DOM

3.2 jQuery中的DOM操作

查找元素节点
查找属性节点：attr() 方法获取属性的值

3.2.2 创建节点

创建元素节点
创建文本节点
创建属性节点

3.2.3 插入节点

3.2.4 删除节点

remove() 方法
empty() 方法

3.2.5 复制节点：clone()方法

3.2.6 替换节点： replaceWith()和replaceAll()。

3.2.7 包裹节点

wrapInner() 方法

3.2.8 属性操作： attr(), removeAttr()方法删除属性
1.设置和获取属性

删除属性

3.2.9 样式操作

获取样式和设置样式
追加样式 addClass()方法
移除样式 removeClass()方法
切换样式 toggle()方法
判断是否含有某个样式 hasclass()方法

3.2.10 设置和获取HTML、文本和值
1.html()方法：可以获取到HTML内容，包括节点结构等。

text() 方法
val()方法

3.2.11 遍历节点

children() 方法获取元素的子元素集合
next() 方法：获取元素后面紧邻的同辈元素
prev() 方法：获取前面紧邻的同辈元素
siblings() 方法：取得前后所有的同辈元素
closest() 方法：获取最近的匹配元素

3.2.12 CSS-DOM操作：读取和设置style对象的各种属性

offset（）方法
position() 方法
scrollTop()方法和 scrollLeft()方法：滚动条距离及设置位置

3.3 案例研究
3.4 小结

第4章 jQuery 中的事件和动画
4.1 jQuery中的事件
4.1.2事件绑定

基本效果

判断元素是否显示：“：visible”

改变绑定事件的类型
简写绑定事件

4.1.3 合成事件 : hover() 和 toggle()

togle()方法

4.1.4 事件冒泡
1.什么是冒泡？
嵌套的元素，内部元素也会影响外部元素绑定的事件，称为事件冒泡。

事件冒泡引发的问题：可能会触发我们本不想触发的事件
需要限制事件的作用范围
事件对象：

停止事件冒泡： stopPropagation() 方法

只会触发span绑定的事件，阻止触发了div和body的点击事件

阻止默认性为： perventDefault() 方法

return false; 可以同时阻止默认行为和事件冒泡。

事件捕获：

4.1.5 事件对象的属性

event.type()方法获取事件的类型
event.preventDefault() 方法
event.target()方法：获取到触发事件的元素
event.relatedTarget() 方法
event.pageX() 方法 / event.pageY() 方法：获取光标相对于页面的x坐标和y坐标
event.which() 方法：获取鼠标和键盘按键

event.originalEvent() event.metaKey()方法：

4.1.6 移除事件

移除按钮元素上注册的点击事件：
移除元素的其中一个事件

one() 方法类似bind() 方法，为元素绑定事件，不过只执行一次，即会解除绑定：

4.1.7 模拟操作 trigger() 方法

传递数据： trigger(type [ , data ]) ,type 为事件类型， data为传递给事件处理函数的附加数据，数组形式传递。

4.1.8 其它用法
1.绑定多个事件类型

添加事件命名空间，便于管理
相同事件名称，不同命名空间执行方法

4.2 jQuery 中的动画
4.2.1 show() 方法和 hide() 方法
hide() 方法会将元素的display样式改为none

jquery动画要求在标准模式下：

让元素动起来：

4.2.2 fadeIn() 方法和 fadeOut() 方法：改变元素不透明度

4.2.3 slideUp() 方法和 slideDown() 方法延伸和缩短

4.2.4 自定义动画方法 animate()

自定义简洁动画：
累加、累减动画
多重动画
综合动画

4.2.5 动画回调函数：

4.2.6 停止动画和判断是否处于动画状态

停止元素的动画：stop() 方法
判断元素是否处于动画状态：：animated

4.2.7 其它动画方法
toggle( speed, [callback])
slideToggle( speed, [callback] )
fadeTo( speed, opacity, [callback] )

4.2.8 动画方法概括

改变样式属性
动画队列

4.4 小结

第五章 jQuery 对表单、表格的操作及更多应用
5.1 表单应用：

5.1.1 单行文本框应用：

5.1.2 多行文本框应用

高度变化

:animated

滚动条高度变化 scrollTop

5.1.3 复选框应用
5.1.4 下拉框应用
5.2 表格应用

锋利的jquery学习相关推荐

锋利的jQuery学习总结
通过对<锋利的jQuery>(第二版)一书的学习,发现此书讲解通俗易懂,是学习jQuery的一本很好的指导书,特作如下总结.此书主要讲解了jQuery的常用操作,包括认识jQuery,jQ ...
锋利的JQuery学习笔记01
1. JQuery的链式操作风格 <script type="text/javascript"> //等待dom元素加载完毕. $(document).ready(fu ...
锋利的jQuery学习笔记（4）-DOM操作
1. DOM操作的分类: DOM Core:JavaScript中的getElementByID,getElementByTagName,getAttribute,setAttribute等方法都是其 ...
《锋利的jQuery》学习总结
通过对<锋利的jQuery>(第二版)一书的学习,发现此书讲解通俗易懂,是学习jQuery的一本很好的指导书,特作如下总结.此书主要讲解了jQuery的常用操作,包括认识jQuery,jQ ...
jQuery学习之：Validation表单验证插件
http://polaris.blog.51cto.com/1146394/258781/ 最近由于公司决定使用AJAX + Struts2来重构项目,让我仔细研究一下这两个,然后集中给同事讲讲,让每 ...
jQuery学习教程（一）：入门
题外话:从今天起正式学习jQuery(实际严格讲已经用了几个月的jQuery的一丁点东西),边学边做边记教程:阅读书籍<锋利的jQuery>+jQuery API Doc. 基础知识: 想 ...
web前端之锋利的jQuery十一：综合开发，编写购物网首页
web前端之锋利的jQuery十一:综合开发,编写购物网首页这章主要介绍如何搭建一个前端网页,文章最后面有完整的代码,前面的主要是说明第一步:搭建网页结构购物网站基本上可以分为以下几部分: 头部 ...
jquery学习（六）-jquery中的动画
参考锋利的jQuery第二版 1.show和hide方法调用方法:element.hide()隐藏元素,element.show()显示元素.其实说白了,其原理就是将元素的样式display值设置为 ...
jQuery学习入门总结之css（）和addClass（）的不同
jQuery学习入门之css()和addClass()的不同这两天研究jQuery的,刚刚开始入门,从昨天开始呢,就发现一个方法addClass的,教程里有一个方法是这样写的 $(docum ...
锋利的jquery 知识点总结
由于看的是锋利的jQuery(第二版)部分内容可能没更新, 推荐看jquery API中文文档第一个jquery程序 // 网页中所有DOM结构绘制完成后就执行, 可能DOM元素关联的东西并没有加载 ...

锋利的jquery学习

有道云笔记无法复制图片到博客，可点击链接查看详细笔记：

锋利的jquery学习相关推荐

最新文章

热门文章