第四章 jQuery节点操作

1.DOM操作分为三类：
（1）DOM Core：任何一种支持DOM的编程语言都可以使用用它
如：getElementById()
（2）HTML-DOM：用于处理HTML文档，如document，forms
（3）CSS-DOM：用于操作CSS，如：element.style.color="green";

2.直接设置样式css()：
（1）css(name,value);
（2）css({name:value,name:value,name:value});

3.追加和移除样式：、
（1）追加样式
addClass(class)
addClass(class1 class2.....)
（2）移除样式
removeClass("style2")
removeClass("style1 style2")

4.切换样式：
toggleClass() 模拟了addClass()与removeClass()实现样式切换的过程

5.html()和test()的区别：
html() 用于获取第一个匹配元素的HTML内容或文本内容
html(content) 用于设置所有匹配元素的HTML内容或者文本内容
text() 用于获取所有匹配元素的文本内容
text(content) 用于设置所有匹配元素的文本内容

6.value值操作：
获取value值：$(this).val();
改变value值：$(this).val("");

7.工厂函数$()用于获取或创建节点
$(selector):通过选择器获取节点
$(element):把DOM节点转化为JQuery节点
$(html)：使用HTML字符串创建JQuery节点

8.插入子节点：
append（contend） $(A).append(B)表示将B追加到A中
appendTo(contend) $(A).appendTo(B)表示将A追加到B中
prepend（contend） $(A).prepend(B)表示将B前位置插入到A中
prependTo（contend） $(A).prependTo(B)表示将A前位置插入到B中

9.插入同辈节点：
after（contend） $(A).after(B)表示将B插入到A之后
insertAfter(contend) $(A).insertAfter(B)表示将A插入到B之后
before（contend） $(A).before(B)表示将B插入到A之前
insertBefore（contend） $(A).insertBefore(B)表示将A插入到B之前

10.替换节点：
replaceWith():后面一个节点替换掉前面一个节点
replaceAll():前面一个节点替换掉后面一个节点

11.复制节点：clone()用于复制某个节点

12.删除节点：
remove():删除整个节点
detach():删除整个节点，保留元素的绑定事件，附加的数据
empty():清空节点内容

13.获取和设置节点属性：
attr()：获取节点属性
attr({属性："值1"，属性："值2"}):设置节点属性

14.删除属性：removeAttr();

15.遍历子节点：children()方法可以用来获取元素的所有子元素
注：在方法括号中写上选择器，表示子元素中哪一个

16.遍历同辈元素：
next([expr]) 用于获取紧邻匹配元素之后的元素
prev([expr]) 用于获取紧邻匹配元素之前的元素
siblings([expr])用于获取位于匹配元素前面和后面的所有同辈元素
注：括号里面可以加上选择器，表示选定某些元素

17.遍历前辈节点：
parent():获取元素的父级元素
parents():获取元素的祖先元素

18.CSS-DOM
css() 设置或返回匹配元素的样式属性
height([value]) 设置或返回匹配元素的高度
width([value]) 设置或返回匹配元素的宽度
offset([value]) 返回以像素为单位的top和left坐标，此方法仅对可见元素有效。

巴特西

第四章 jQuery节点操作

最新文章

热门文章