接下来我将详细讲解“JQuery操作DOM元素方法详解”的完整攻略。如下：

JQuery操作DOM元素方法详解

什么是DOM

DOM全称为文档对象模型（Document Object Model）。它是HTML和XML文档的编程接口，使得HTML和XML文档能够被程序语言（比如JavaScript、JQuery等）进行操作。在JQuery中，也可以使用DOM元素进行操作。

Jquery选取DOM元素的方法

1. 选取元素

选取元素的方法可分为两大类：

• 基本选择器

基本选择器可以根据元素的标签名、id和class来选取元素，且效率较高。

示例代码：

$("div") //选取所有div元素
$("#idName") //选取id为idName的元素
$(".className") //选取class为className的元素

• 层级关系选择器

层级关系选择器可根据元素的层级关系来选取元素。

示例代码：

$("ancestor descendant") //选取祖先元素下的所有后代元素
$("parent > child") //选取父元素下的直接子元素
$("prev + next") //选取前一个元素后面的相邻元素
$("prev ~ siblings") //选取前一个元素后面的所有兄弟元素

1. 过滤元素

可通过过滤器来筛选多个元素中符合条件的元素。

示例代码：

$("element:first") //选取符合条件的元素集合中的第一个元素
$("element:last") //选取符合条件的元素集合中的最后一个元素
$("element:even") //选取符合条件的元素集合中的偶数元素
$("element:odd") //选取符合条件的元素集合中的奇数元素
$("element:lt(index)") //选取符合条件的元素集合中索引值小于指定索引值的元素
$("element:gt(index)") //选取符合条件的元素集合中索引值大于指定索引值的元素
$("element:not(selector)") //选取符合条件的元素集合中不符合选择器的元素
$("element:has(selector)") //选取符合条件的元素集合中含有符合选择器的元素的直接子元素
$("element:contains(text)") //选取符合条件的元素集合中含有指定文本的元素

Jquery操作DOM元素的方法

1. 获取和设置元素内容

获取和设置元素内容的方法如下：

.text() //获取或设置元素的纯文本内容，去除所有的HTML标记
.html() //获取或设置元素的innerHTML，即包括所有的HTML标记
.val() //获取或设置表单元素的value属性值

示例代码：

$("p").text() //获取所有p元素的文本内容
$("p").text("hello world") //将所有p元素的文本内容设置为"hello world"

1. 获取和设置元素属性

获取和设置元素属性的方法如下：

.attr(name) //获取指定属性的值
.attr(name,value) //设置指定属性的值
.removeAttr(name) //删除指定属性

示例代码：

$("img").attr("src") //获取所有img元素的src属性值
$("img").attr("src","newlink") //将所有img元素的src属性值设置为"newlink"
$("img").removeAttr("src") //删除所有img元素的src属性

1. 获取和设置元素样式

获取和设置元素样式的方法如下：

.css(name) //获取指定样式的值
.css(name,value) //设置指定样式的值

示例代码：

$("p").css("color") //获取所有p元素的color样式值
$("p").css("color","red") //将所有p元素的color样式值设置为red

以上是关于JQuery操作DOM元素的一些基础方法和技巧的详细介绍。希望对您有所帮助！