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请求向服务器提交数据。