一、属性操作
1.1 设置或者获取元素固有属性值 prop()
element.prop("属性名") //获取属性值 console.log($("a").prop("href")); // "http://www.itcast.cn"
element.prop("属性","属性值") //设置属性语法
1.2 设置或获取自定义属性 attr()，这个属性原来是没有的
element.attr("属性名") //获取属性值,类似原生getAttribute()
element.attr("属性","属性值") //设置属性语法,类似原生setAtribute()
<div index="1" data-index="2"><div>
console.log($("div").attr("index")); // "1"
console.log($("div").attr("data-index")); // "2"
1.3 数据缓存 data()
在指定的元素上存取数据，并不会修改DOM元素结构，一旦页面刷新，之前存放的数据都将被移除
把数据存放到内存中，在DOM中看不到
element.data("name","value") //向被选元素附加数据
element.data("name") //向被选元素获取数据
<span></span> $("span").data("uname", "andy"); console.log($("span").data("uname")); // andy
同时，还可以读取HTML5 自定义属性 data-index ，得到的是数字型
<div data-index="2"><div> //这个方法获取data-index h5自定义属性，不用向attr()那样写 data-index，而且返回的是数字型 console.log($("div").data("index"));
二、jQuery内容文本值
主要针对元素的内容还有表单的值操作
2.1 普通元素内容 html() ,相当于原生innerHTML
element.html() // 获取元素的内容，包括里面的标签 element.html("内容") // 设置元素的内容
2.2 普通元素文本内容text() ,相当于原生innerText
element.text() // 只获取里面的文字内容，不包含标签 element.text("内容")
2.3 设置获取表单值 val(), 相当于原生 value
element.val()
element.val("内容")
element.parents('选择器') //返回所有的父亲节点
三、jQuery操作元素
3.1 遍历元素
如果想给同一类元素做不同的操作，就需要用到遍历
$("div").each(function(index, domElement){})
// each()方法遍历匹配的每一个元素，主要用DOM处理
// 里面的回调函数有两个参数：index是每个元素的索引号，domElement是每个DOM元素对象，不是jQuery对象
// 所以要想使用jQuery方法，需要把DOM元素对象转化为jQuery对象 $(domElement)
$.each(object, function(index,element){}) // 该方法可以遍历任何对象，主要用于数据处理，比如数组，对象 // 里面的函数有两个参数：index是每个元素的索引号，element遍历内容
3.2 创建元素
$("<li></li>") // 动态的创建了一个<li>
3.3 添加元素
- 内部添加（父子关系）
element.append("内容") // 把内容放入匹配元素内部最后面，类似原生 appendChild
element.prepend("内容") // 把内容放入匹配元素内部最后面
- 外部添加（兄弟关系）
element.after("内容") // 把内容放入目标元素后面
element.before("内容") // 把内容放入目标元素前面
3.4 删除元素
element.remove() //删除匹配的元素（本身） element.empty() //删除匹配的元素集合中所有的子节点（孩子） element.html("") //清空匹配的元素内容，和empty一样