★jQuery是js的程序库之一,它是js对象和实用函数的封装!
★集javaScript,CSS,DOM,Ajax于一体的强大框架体系,
大大提高用户体验,减少代码的编写
★【加载时机】:
js写法:window.onload
必须等待网页中所有的内容加载完毕后,(图片等) 才能执行!
jquery写法:$(document).ready() ——> $(function(){})
网页中所有DOM文档结构绘制完毕后即刻执行, (图片,视频等)并没有加载完!
jquery选择器分类:
☆【CSS选择器】:
★基本选择器 ★层次选择器 ★属性选择器
- 【基本选择器】:
element:指定标签名
class.指定元素
id#指定元素
*全局
并集选择器,合并后一起返回
- 【层次选择器】:
$(s1 s2) [后代]:子子孙孙,在s1的所有s2后代
$(s1 > s2) [父子]:子元素选择器:在s1内部获得s2的子元素节点
$(s1 + s2) 相邻元素[兄弟]:在s1后边获得紧紧挨着的第一个兄弟关系的s2节点(1个)
$(s1 ~ s2) [同辈元素]:在s1后边获得全部兄弟关系的s2节点
- 【属性选择器】:
以什么开头则是^
☆【过滤选择器】:(冒号开头)
★基本过滤 ★可见性过滤
【可见性过滤】:
$(":visible") 选取所有可见的元素
$(":hidden")选取所有隐藏的元素
★有关过滤请注意:空格问题,冒号后都无空格
$(".test :hidden")选取的是元素内部的隐藏元素
☆ jQuery的事件
事件三要素:事件源.事件 = function() {
事件处理函数}
常用事件:鼠标事件,键盘事件,window事件,表单事件
★【鼠标事件】:
★对比:mouseover ,mouseout 会触发!
mouseenter():如果鼠标指针, 在其被选元素的子元素上来回进入则不会触发事件。
mouseleave():如果鼠标指针 ,在其被选元素的子元素上来回离开则不会触发事件。
★【键盘事件】:
keydown():键盘按下,
keyup()键盘释放,
keypress():文本事件,产生可打印的字符,区分大小写
keyCode:对应的键码值
执行顺序:keydown——>keypress——>keyup
★【绑定与移除事件】:
bind("事件名", name = function(){})——>unbind("事件名", 解绑函数名)
相同事件时,需用2个.bind()方法,合写将会覆盖。
解绑不带参数时,即解绑所有事件
on()——>off() 类似于前者,此为新!
★【class样式操作】:
设置和获取:css() —— 根据参数区分!
追加和移除:addClass("样式名 ...")——>removeClass()
判断是否含指定:
hasClass() —— 结合if判断,返回值为布尔类型,
★【属性操作】:
attr():方法参数1表示获取标签属性值,2表示设置。★请注意区分与val()!
removeAttribute():删除标签元素属性
★【节点遍历】:
children() ——>遍历子元素
next() 下,prev() 上 ——>遍历同辈元素
siblings() ——>所有同辈元素
------------------------------------------------------------
遍历前辈元素:
parent() ——>父级元素
parents() ——>祖先元素
each():等同于循环遍历 ,