jQuery DOM操作,属性和样式操作(二)
DOM操作
1 内部插入
append(content|fn) 向每个匹配的元素内部追加内容
appendTo(content) 把所有匹配的元素追加到另一个指定的元素元素集合中
prepend(content|fn) 向每个匹配的元素内部前置内容
prependTo(content) 把所有匹配的元素前置到另一个、指定的元素元素集合中
2 外部插入
after(content|fn) 在每个匹配的元素之后插入内容
before(content|fn) 在每个匹配的元素之前插入内容
insertAfter(content) 把所有匹配的元素插入到另一个、指定的元素元素集合的后面
insertBefore(content) 把所有匹配的元素插入到另一个、指定的元素元素集合的前面
3 包裹
wrap(html|ele|fn) 把所有匹配的元素用其他元素的结构化标记包裹起来
unwrap() 这个方法将移出元素的父元素
wrapAll(html|ele) 移出元素的父元素
wrapInner(html|ele|fn) 将每一个匹配的元素的子内容(包括文本节点)用一个HTML结构包裹起来
4 替换
replaceWith(content|fn) 将所有匹配的元素替换成指定的HTML或DOM元素
replaceAll(selector) 用匹配的元素替换掉所有 selector匹配到的元素
5 删除
empty() 删除匹配的元素集合中所有的子节点
remove([expr]) 从DOM中删除所有匹配的元素
detach([expr]) 从DOM中删除所有匹配的元素 这个方法不会把匹配的元素从jQuery对象中删除,因而可以在将来再使用这些匹配的元素。与remove()不同的是,所有绑定的事件、附加的数据等都会保留下来
6 复制
clone([Even[,deepEven]]) 克隆匹配的DOM元素并且选中这些克隆的副本
属性和样式操作
1 元素属性操作
1.1 属性
attr(name|pro|key,val|fn) 设置或返回被选元素的属性值
removeAttr(name) 从每一个匹配的元素中删除一个属性
prop(n|p|k,v|f) 获取在匹配的元素集中的第一个元素的属性值
removeProp(name) 用来删除由.prop()方法设置的属性集
1.2 class
addClass(class|fn) 为每个匹配的元素添加指定的类名
removeClass([class|fn]) 从所有匹配的元素中删除全部或者指定的类
toggleClass(class|fn[,sw]) 如果存在(不存在)就删除(添加)一个类
hasClass(class) 检查当前的元素是否含有某个特定的类,如果有,则返回true
1.3 代码、文本、值
html([val|fn]) 取得第一个匹配元素的html内容
text([val|fn]) 取得所有匹配元素的内容
val([val|fn|arr]) 获得匹配元素的当前值
2 元素样式操作
2.1 设置CSS
css(name|pro|[,val|fn]) 访问匹配元素的样式属性
2.2 元素位置
offset() 获取匹配元素在当前视口的相对偏移
position() 获取匹配元素相对父元素的偏移
scrollLeft() 获取匹配元素相对滚动条顶部的偏移
scrollTop() 获取匹配元素相对滚动条左侧的偏移
2.3 元素尺寸
widht() 取得第一个匹配元素当前计算的宽度值(px)
height() 取得匹配元素当前计算的高度值(px)
innerWidth() 匹配元素内部区域宽度(包括补白、不包括边框)
innerHeight() 匹配元素内部区域高度(包括补白、不包括边框)
outerWidth() 匹配元素外部宽度(默认包括补白和边框)
outerHeight() 匹配元素外部高度(默认包括补白和边框)