---学习视频是黑马程序员pink老师的教学视频
传送门
----因为前天喝多了，昨天学的效果不好，忘记了一些今天重新走一遍 ♢︹♢
3.4 jQuery属性操作
3.4.1 jQuery prop()
获取元素默认值
$("a").prop("href")
设置元素默认值
$("a").prop("title","都挺好")
3.4.2 attr()
获取自定义属性
$("div").attr("index")
设置自定义属性
$("div").attr("index",4)
3.4.3 数据缓存 data()
data()方法可以在指定的元素上存取数据，并不会修改DOM元素结构，一旦页面刷新，之前存的数据都会被删除
这里面的数据是存放在元素的内存里面
语法：
$("span").data("uname","andy")
输出：
$("span").data("uname")
这个方法获取data-index h5自定义属性 第一个 不用写data- 而且返回的是数字型
console.log($("div").data("index"));//4
3.4.4 全选全不选案例
jQuery
全选
A
B
C
全选
3.5 jQuery 内容文本值
3.5.1 获取设置元素内容
$("div").html("123")
获取设置元素文本内容
$("div").text("123")
获取设置表单值
$("input").val("123")
3.5.2
获取祖先元素
parents()
$("div").oarents("body")
保留两位小数
tofixed(2)
可以让我们保留两位小数
3.6 jQuery元素操作
主要是遍历 创建 添加 删除元素操作
遍历：
语法一：
$("div").each(function(index,domEle){xxx})
1.each（）方法遍历匹配的每个元素，主要用DOM处理，each每一个
2.里面的回调函数有两个参数：index是每个元素的索引值；demEle是每个DOm元素对象不是jQuery对象
语法二：
$.each(object , function (index,element){ xxx; }))
1 $.each()的方法可以用于遍历任意对象，主要用于数据处理，比如数组，对象
2 里面有两个参数： index是索引号 element遍历内容
$.each({
name: "andy",
age: "18"
},function(i,ele){
console.log(i) // 输出 name age (属性名)
console.log(ele) // 输出 andy 18 （属性值）
}
3.6
创建元素
var li = ("
添加元素
内部添加
$("ul").apperd(li)
把元素放到内容的最后面 类似原生的appendChild
$(ul).prepend(li)
内部添加并且放到内容的最前面
外部添加
var div = $("
$("元素").after(div)
$("元素").before(div)
删除元素
element.remove() // 删除匹配的元素（本身）
element.empty（）//删除匹配的元素集合中的所有子节点
element.html("") //清空匹配的元素内容
嘟嘟嘟哒哒哒~~
3.7 jQuery尺寸，位置操作
3.7.1 尺寸方法
1 width（） 获取设置元素width或height大小
$("div").width(300)
2 innerWidth() /innerHeight() 获取设置元素 width/height + padding 大小
$("div").innderWidth()
3 outerWidth() / outerHeight() 获取设置元素 width / height +padding + border大小
$("div").outerWidth
4 outerWidth(true) / outerHeight(true)获取设置 width和height +padding + border + margin
3.7.2 jQuery位置方法
有 offset（）。position（） 。scrollTop/scrollLeft()
1 获取设置距离文档的位置（偏移）offset()
offfset() 方法设置或返回被选元素相对于稳当的偏移坐标，跟父级没有关系。
$("元素").offset({
top:300,
left:300
})
2 position（） 获取距离带有定位父级位置（偏移）position 如果没有带定位的父级 则以文档为准
$("子元素").position()
此方法只能获取不能设置
3 scrollTop()/scrollLeft方法设置或返回被选元素 别卷去的头部/左边
(document).scrollTop() //页面滚动时文档被卷去的上方高度
})
3-1 带有动画的返回顶部
jQuery
返回顶部
animate动画函数里面有个scrollTop属性，可以设置位置
只能是元素设置动画 文档不行
4 jQuery事件
4.1.1 jQuery 事件注册
- 单个元素注册
$("div").事件（[fn]）
- 多个注册事件
事件处理on（）
(this).css("background","skyblue")
},
click:function(){
(this).css("background","blue")
}
})
on() 可以事件委派操作，事件委派的定义就是，把原来加给子元素身上的事件绑定在父元素身上，就是把事件委派给父元素
$("父元素").on("事件名"，"子元素"，[fn])
("li").css("color","red")
})
on() 可以给动态创建的元素绑定事件
4.1.2 解绑事件
off()
$("div").off() //全部解绑
$("div").off("click") //解绑单个事件
$("ul").off("click","li") //解绑事件委托
one() 只触发一次的事件
4.1.3 jQuery自动触发事件
element.click() //第一种简写形式 元素。事件
$("div").click()
element.trigger("type") //第二种简写形式 元素。trigger（“事件”）
$("div").trigger("click")
element.triggerHandler(type) //第三种自动触发模式
$("div").triggerHandler("click")
$("input").triggerHandler("focus") //没有光标闪烁
4.2 jQuery 事件对象
事件被查出发iu会有事件对象产生
element.on(evevts,[selector],function(event){})
阻止默认行为：event.preventDefault() 或者 return false
阻止冒泡： event.stopPropagation()