jQuery对DOM的操作

“jQuery中非常重要的部分，就是对DOM的操作！”

“jQuery中非常重要的部分，就是对DOM的操作！”

“jQuery中非常重要的部分，就是对DOM的操作！”

一、jQuery操作HTML

方法有：

html("<b<hello world!</b>") 设置或返回所选元素的内容（含html标记）

text("hello world!") 设置或返回所选元素的文本内容

val() 设置或返回所选表单的的值，

栗子: ~~$("#text").val("不晚")；~~<input type="text" id="text" value="姓名">

//将输入框内的内容改为“不晚”

attr("xx属性","x值") 设置所选元素的xx属性为x值。

也同时设置多个属性组：attr({"xx属性":"x值","yy属性":"y值"})

//区别：设置单个属性时，中间用逗号隔开；设置多个属性时，中间用冒号，属性与属性之间用逗号

添加内容：

• append() - 在被选元素的结尾插入内容
• prepend() - 在被选元素的开头插入内容
• after() - 在被选元素之后插入内容
• before() - 在被选元素之前插入内容

删除内容：

• remove() - 删除被选元素（及其子元素）
• empty() - 从被选元素中删除子元素

二、jQuery操作CSS

• addClass() - 向被选元素添加一个或多个类
• removeClass() - 从被选元素删除一个或多个类
• toggleClass() - 对被选元素进行添加/删除类的切换操作
• css() - 设置或返回样式属性

三、jQuery对DOM进行遍历（traversal）

1、查找父级元素：

parent() 查找所选元素的父元素

parents() 查找所选元素的所有祖先元素

parentsUntil() 查找所选元素与until元素之间的所有祖先元素

2、查找子级元素

children() 查找所选元素直接一级的子元素

find() 查找所选元素的所有后代元素

3、查找同胞元素

siblings() 查找所选元素的所有同胞元素

next()/prev() 查找所选元素的下一个/上一个同胞元素

nextAll()/prevAll() 查找所选元素后面/前面的所有同胞元素

nextUntil()/prevUntil() 查找所选元素和until元素之间的所有同胞元素

4、过滤

first()/last() 查找所选元素集里的第一个/最后一个元素

eq(x) 查找所选元素集里的第x+1个元素

not("x") 查找所选元素集里的非x元素