jQuery 学习笔记

(菜鸟教程：http://www.runoob.com/jquery/jquery-tutorial.html)

jQuery效果

1、jQuery选择器：元素选择器、属性选择器、CSS选择器

2、jQuery事件：ready()将函数绑定到文档的就绪事件，即当文档加载完成时；

click()单击事件；

dblclick()鼠标双击事件;

focus()获取焦点事件；

mouseover()鼠标悬停事件.

3、hide()：隐藏函数

4、show()：显示函数

5、toggle()：可以切换hide()和show()方法

6、fadeIn(效果时长，执行函数)：用于淡入已隐藏的元素

7、fadeOut(效果时长，执行函数)：用于淡出可见元素

8、fadeToggle(效果时长，执行函数)：可以切换fadeIn()和fadeOut()方法

9、fadeTo(效果时长，必需的 opacity 参数将淡入淡出效果设置为给定的不透明度，执行函数):允许渐变为给定的不透明度(值介于 0 与 1 之间)

10、slideDown(效果时长，执行函数)：用于向下滑动元素

11、slideUp(效果时长，执行函数)：用于向上滑动元素

12、slideToggle(效果时长，执行函数)：可以切换slideDown()和slideUp()方法

13、animate({定义形成动画的CSS属性},效果时长，执行函数)：用于创建自定义动画。

使用预定义的值：可以吧属性的值设置为：show、hide、toggle(例：height:'toggle')。

使用相对值：在值得前面加上'+='或'-='，如：height:'+=150px'

14、stop(是否应该清除动画队列,是否立即完成当前动画):用于在动画或效果完成前对它们进行停止

jQuery HTML

1、text(“内容”或function函数)：设置或返回所有元素的文本内容

2、html(“内容”或function函数)：设置或返回所选元素的内容(包括html)

3、val(“内容”或function函数)：设置会返回表单字段的值

4、attr({"href" : "http://www.w3school.com.cn/jquery","title" : "W3School jQuery Tutorial"})可以同时设置多个值或attr

("href","http://www.w3school.com.cn/jquery")：用于获取属性值

5、append(“内容”)：在被选元素的结尾插入内容

6、prepend(“内容”)：在被选元素的开头插入内容

7、after(“内容”)：在被选元素之前插入内容

8、before(“内容”)：在被选元素之后插入内容

9、remove()：删除被选元素(及其子元素)

10、empty()：从被选元素中删除子元素

11、addClass(“类名”)：向被选元素添加一个或多个类

12、removeClass(“类名”)：从被选元素删除一个或多个类

13、toggleClass(“类名”)：对被选元素进行添加或删除类的切换操作

14、css(“样式属性”：“样式值”，“样式属性”：“样式值”)：设置或返回被选元素的一个或多个样式属性

15、width()/height()：回文档(HTML 文档)和窗口(浏览器视口)的宽度和高度

16、innerWidth()/innerHeight()：返回元素的宽度(包括内边距和边框)

17、outerWidth()/outerHeight()：返回元素的宽度(包括内边距、边框和外边距)

jQuery遍历

1、parent()： 方法返回被选元素的直接父元素

2、parents() 方法返回被选元素的所有祖先元素，它一路向上直到文档的根元素 ()

3、parentsUntil() 方法返回介于两个给定元素之间的所有祖先元素

4、children() 方法返回被选元素的所有直接子元素

5、find() 方法返回被选元素的后代元素，一路向下直到最后一个后代

6、first() 方法返回被选元素的首个元素。

7、last() 方法返回被选元素的最后一个元素。

8、eq() 方法返回被选元素中带有指定索引号的元素

8、filter() 方法允许您规定一个标准。不匹配这个标准的元素会被从集合中删除，匹配的元素会被返回。

9、not() 方法返回不匹配标准的所有元素。提示：not() 方法与 filter() 相反。

10、siblings() 方法返回被选元素的所有同胞元素。

11、next() 方法返回被选元素的下一个同胞元素。

12、nextAll() 方法返回被选元素的所有跟随的同胞元素。

13、nextUntil() 方法返回介于两个给定参数之间的所有跟随的同胞元素。

14、prev(), prevAll() 以及 prevUntil() 方法的工作方式与上面的方法类似，只不过方向相反而已：它们返回的是前面的同胞元素(在 DOM 树中沿着同胞之前元素遍历，而不是之后元素遍历)。

jQuery  Ajax

1、load(希望加载的url，规定与请求一同发送的查询字符串键/值对集合，执行函数名):从服务器加载数据，并把返回的数据放入被选元素中。

2、$.get(希望请求的URL，执行函数)：通过http get请求从服务器上请求数据

3、$post(希望请求的url，连同请求发送的数据，执行函数):通过http post请求向服务器提交数据。