本文共 2082 字，大约阅读时间需要 6 分钟。

jquery里面的dom总结

注: this和$(this)

1. 获取值的方法

html() 取得第一个匹配元素的html内容.这个函数不能用于XML文档.但可以用于XHTML文档

text() 取得所有匹配元素的内容.结果是由所有匹配元素包含的文本内容组合起来的文本

val() 既可以获取input里面的值/也可以设置值 如果是下拉菜单 、单选、多选的情况下

val([’’])方法 还可以将他们设置成默认选中

prop('checked',true) 专属input默认选中方法

2. 操作属性的方法

attr() 获取/设置元素属性的方法 ,还可以设置多个属性 设置多个属性采用对象的模式

removeAttr() 移除属性方法

addClass() 只能向元素添加class值

removeClass() 删除属性方法

toggleClass() 添加样式切换方法 （方法中不加.）

hasClass()/is() 检查元素是否包含指定的类 （方法中不加 .）

注: prop和attr的区别

3. 遍历方法

each() 元素的遍历方法

$().each() 用来操做dom

$.each(arr,function(下标，内容){}) 比如遍历数组

4. 节点内部插入

var box=$('
   
    你好
   
')	创建一个标签	append()		插入到标签里面的后面		eg: $('#box').append(a);	appendTo()		插入到标签里面的后面		eg: a.appendTo($('#box'));	prepend()		插入到标签里面的前面		eg: $('#box').prepend(a);	prependTo()		插入到标签里面的前面		eg: a.prependTo( $('#box'));

5. 节点外部插入

before()		向指定元素前插入一个同级标签  eg: $('#box').before(a);	insertBefore()  将指定元素移入指定元素前面	eg: a.insertBefore($('#box'));	after()			向指定元素后插入一个同级标签  eg: $('#box').after(a);	insertAfter()   将指定元素移入指定元素后面	eg: a.insertAfter($('#box'));

6. 包裹节点方法

wrap() 向指定元素包裹一层代码

wrap(element) 向指定标签包裹指定标签

unwrap() 移除指定元素上一层标签

wrapAll() 包裹所有的指定元素上

wrap()和wrapAll()的区别是：

       wrap()方法是把指定标签看成独立体分别包裹

       wrapAll()方法是把指定标签包裹成一个独立体

7. 操作节点方法

clone(true/false) 克隆节点

如果克隆里面是false ,那么他是不会克隆事件行为的，有true的话就会克隆事件行为

remove() 删除节点

detach() 删除节点

empty() 删除内容保留标签

replaceWith() 替换节点

replaceAll() 替换节点(先创建再删除)

注: detach()和remove()区别

注: clone(true,false)

8. 其他css方法

width() 获取/设置元素的宽度

height() 获取/设置元素的高度

innerWidth() 获取元素的宽,包含内边距（padding）

innerHeight() 获取元素的高,包含内边距（padding）

outerWidth() 获取元素的宽,包含内边距（padding）+边框（border）

outerWidth(true) 获取元素的宽,包含内边距（padding）+边框（border）+外边距（margin）

outerHeight() 获取元素的高,包含内边距（padding）+边框（border）

9. 元素偏移方法

offset() 元素相对可视窗口的偏移位置

position() 元素相对父元素的偏移位置

scrollTop(val) 获取/设置垂直滚动条的值

scrollLeft(val) 获取/设置横滚动条的值

转载地址：https://blog.csdn.net/ZZZ___jh/article/details/109476743 如侵犯您的版权，请留言回复原文章的地址，我们会给您删除此文章，给您带来不便请您谅解！