JQuery复习

一、jQuery的优势
二、jQuery使用步骤和语法结构
三、jQuery获取DOM节点信息的常用方法（内容、样式、属性）
四、jQuery选择器的分类和示例
1.基础选择器
#id .class div *
并集 div,a,h1{}
交集 div.class{}
2.层次选择器
后代 div div
直接子集 div>div
相邻下一个兄弟 #id+.class{下一个兄弟并且满足.class}
后面的所有兄弟 #id~.class{所有的所有兄弟并且满足.class}
3.属性选择器
是否包含指定属性 [属性名]
判断属性值
= != *= ^= $=
4.过滤选择器
1.位置：
:first :last
:nth-of-type(1)
:nth-child(1)
2.下标
:eq(0)
:lt(0) 小于
:gt(0) 大于
:even 下标0开始的偶数
:odd 下标0开始的奇数
3.取反
:not(选择器) 不满足的被选中
4.内置属性、状态
:header h1~h6标签
:animated 动画元素

:focus 鼠标聚焦的元素
:visible 可见的
:hidden 隐藏的
五、jQuery对象与DOM对象的转换方法

六、jQuery中的事件分类
1.鼠标事件
2.键盘事件
3.window事件 页面加载 页面滚动条 窗口位置拖动 窗口大小改变
4.表单事件 重置 提交 鼠标聚焦 鼠标离开焦点 内容改变
5.复合事件
hover 鼠标移上移出
toggle 鼠标连续点击
toggleClass 来回修改class
6.动画事件
show() hide() 显示、隐藏
fadeIn() fadeOut() 透明度淡入淡出
slideUp() slideDown() 高度延伸、缩小
animate()动画
七、jQuery节点操作的分类
1.DOM Core 核心语法，浏览器内核支持 js
2.HTML 节点，文档结构
3.CSS 样式，未来渲染
八、jQuery节点操作
1.样式操作
addClass()
removeClass()
toggleClass(className) 自动判断是否有次classname,有则remove，无则add
hasClass() boolean返回值
css() 样式设置
2.内容操作
html() 获取第一个节点的内容
html(content) 所有节点的内容改变
text() 所有节点的文本
text(content) 所有节点的文本改变
val() 获取节点的value属性值
attr("属性名") 获取指定属性名的属性值
attr("属性名","属性值") 改变属性名的值为指定值
3.节点操作
1.查找子元素 children("选择器") find("选择器")
div p a
$("div>p>a") $("div>p").find("a");
$("div>p").click(function(){
$(this).find("a").css("","");
})
2.添加子元素
append 添加到子元素中最后
prepend 添加到子元素中最前
3.添加同辈元素
after 自己的后面 A.after(B) A B
before 自己的前面
4.删除元素
remove() 删除自身 包含节点
empty() 清空内容
detach（） 删除节点，保留事件
5.替换元素
replaceWith
replaceAll
6.复制元素
clone() ture 深度克隆 保留事件和子元素
false 浅度克隆 只复制自己的标签和属性
7.属性操作
attr()
removeAttr("属性名")
8.关系节点
children() 子元素
next() 下一个同辈
prev() 前一个同辈
slibings() 前后所有同辈
9.父级节点
parent() 直接父级
parents()
10.节点遍历
$("选择器").each(function(i,o){
i//下标
o//js Dom对象
$(o) jq对象
$(this) jq对象
})
$.each($("选择器"),function(i,o){

})
九、CSS操作
语法 功能
css() 设置或返回匹配元素的样式属性
height([value]) 设置或返回匹配元素的高度
width([value]) 设置或返回匹配元素的宽度
offset([value]) 返回以像素为单位的top和left坐标。仅对可见元素有效
offsetParent( ) 返回最近的已定位祖先元素。定位元素指的是元素的CSS position值被设置为relative、absolute或fixed的元素
position( ) 返回第一个匹配元素相对于父元素的位置
scrollLeft([position]) 参数可选。设置或返回匹配元素相对滚动条左侧的偏移
scrollTop([position]) 参数可选。设置或返回匹配元素相对滚动条顶