jQuery元素操作

jQuery元素操作主要讲的是使用jQuery方法，操作标签的遍历，创建，添加，删除等操作。

一，遍历元素

jQuery隐式迭代是对同一类元素做了同样的操作。如果想要给同一类元素做不同操作，就需要用到遍历。

语法1：

•    $.each()方法可用于遍历任何对象，主要用于数据处理，比如数组，对象
• 里面的函数有2个参数：index是每个元素的索引号：dom遍历内容

注意：此方法用于遍历jQuery对象中的每一项，回调函数中元素需要DOM对象，想要使用jQuery方法需要转化

语法2：

$("div").each(function(index,domEle){

 xxxxxx

})

• each()方法遍历匹配的每一个元素，主要是用DOM处理。each每一个
• 里面的回调函数有2个参数：index是每个元素的索引号；domEle是每个DOM元素对象，不是jQuery对象
• 所以要想使用jquery方法，需要给这个dom元素转化为jQuery对象 $(domEle)

注意：此方法用于遍历jQuery对象中的每一项，回调函数中元素为DOM对象，想要使用jQuery方法需要转化。

例如：

 二，创建，添加，删除

jQuery方法操作元素的创建，添加，删除方法有很多，则重点使用部分，如下

1.创建

$("<li> </li>")

动态的创建了一个<li>

2. 1.内部添加

 2.2.外部添加

• 内部添加元素，生成之后，它们是父子关系。
• 外部添加元素，生成之后，他们是兄弟关系。

3.删除元素

$("li").remove() 删除匹配的元素（本身）

 $("li").empty()  删除匹配的元素集合中所有的子节点

 $("li").html(" ")   清空匹配的元素内容

remove删除元素本身

empty() 和html(" ")作用等价，都可以删除元素里面的内容，只不过html还可以设置内容

三，jquery常用属性操作有三种：prop() / attr() /data()

3.1元素固有属性值

所谓元素固有属性值就是元素本身自带的属性,比如<a>元素里面的href，比如<input>元素里面的type

语法

描述	语法
获取属性语法	prop("属性“）
设置属性语法	prop("属性”，“属性值”）

注意：prop()除了普通属性操作，更适合操作表单属性：disabled/ checked/selected等

3.2元素自定义属性值 attr()

用户自己给元素添加的属性，我们称为自定义属性，比如给div添加index="1"

语法

描述	语法
获取属性语法	attr("属性”） //类似原生getAttribute()
设置属性语法	attr("属性","属性值“）//类似原生setAttribute()

注意：attr()除了普通属性操作，更适合操作自定义属性，（该方法也可以获取H5 自定义属性）

3.3数据缓存 date()

date()方法可以在指定的元素上存取数据，并不会修改DOM元素结构，一旦页面刷新，之前存放的数据都将被移除

语法：

描述	语法
附加数据语法	date("name","value")  //向被选元素附加数据
获取数据语法	date("name")  //向被选元素获取数据

注意:同时，还可以读取HTML5自定义属性date-index，得到的是数字