1.區分attr，prop，addClass ，css
注意區分，屬性 和 樣式屬性 平常說的屬性包括id class style lang dir title等，然後注意樣式屬性指的是設置在 style 屬性裏面或者 style 標籤裏面的 ，不要搞混.css() 只能獲取是 style 裏面的屬性值；
注意語法：獲取style樣式屬性值：對象.css(“屬性名”），設置style樣式屬性值：對象.css(“屬性名”），設置style樣式屬性值：對象.css(“屬性名”，“屬性值”）雙引號必不可少
attr，prop 是操作屬性，也就是id，class，style，lang，dir，title，alt--------------標籤裏面的屬性
attr：我們自定義的DOM屬性
2。class操作
1.添加樣式
addClass(name);
name:類樣式名字
$("li").addClass("bigger");
2.刪除樣式
.removeClass(name);
name:類樣式名字
$("li").removeClass("bigger");
3.判斷是否有樣式
hasClass(name);
name:類樣式名字
$("li").hasClass("bigger");
4.切換類樣式
toggleClass(name);
name:類樣式名字
$("li").toggleClass("bigger");
3.三種基本動畫
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
<style>
div{
width: 300px;
height: 300px;
background: deeppink;
display: none;
}
</style>
</head>
<body>
<div></div>
<input type="button"value="顯示">
<input type="button"value="隱藏">
<input type="button"value="卷出來">
<input type="button"value="卷出去">
<input type="button"value="切換1">
<input type="button"value="淡入">
<input type="button"value="淡出">
<input type="button"value="切換2">
<script src="jquery-1.12.4.js"></script>
<script>
$(function () {
$("input").eq(0).click(function () {
$("div").show("fast",function () {
console.log("動畫借宿了");
});
});
$("input").eq(1).click(function () {
$("div").hide("fast",function () {
console.log("動畫隱藏了");
});
});
$("input").eq(2).click(function () {
$("div").slideDown("fast",function () {
console.log("動畫卷出來");
});
});
$("input").eq(3).click(function () {
$("div").slideUp("fast",function () {
console.log("動畫卷出去");
});
});
$("input").eq(4).click(function () {
$("div").slideToggle("fast",function () {
console.log("動畫卷上卷下切換");
});
});
$("input").eq(5).click(function () {
$("div").fadeIn("fast",function () {
console.log("動畫淡入");
});
});
$("input").eq(6).click(function () {
$("div").fadeOut("fast",function () {
console.log("動畫淡出");
});
});
$("input").eq(7).click(function () {
$("div").fadeToggle("fast",function () {
console.log("動畫淡入淡出切換");
});
});
})
</script>
</body>
4.play與load
load與play是DOM對象中的，不能用eq()
在出現音頻，視頻標籤谷歌不支持，火狐和ie支持
5.有的對象可以鏈式操作，有的不能，
6.元素創建與追加
創建：$(”<span></span>“) 直接$(“html標籤代碼”)
追加append() 1.$(父級元素).append("創建的子集元素") 2.$("子集元素").appendTo("父級元素")
7.注意點
動畫函數裏面參數animate({屬性：值}，數值，“linear”function（）{})
不要忘了linear加引號，對象裏面屬性與值可加可不加
有的對象可以鏈式操作，有的不能，
一定要用this
$(function () {
$("a").click(function () {
$("#image").attr("src",$(this).children("img").attr("src"));//將a標籤中的小圖的attr中的src屬性傳給給大圖的src屬性
$("#des").text($(this).attr("title"));//將a標籤中的title屬性傳給p標籤的text方法，它返回的是a標籤title屬性的值
return false;
});
})
重點注意，在點擊事件中一定要用this，如果用this所指的對象名會達不到效果，
因爲this指的是當前，而對象由於隱式迭代，它所指的是所有的對象
後代選擇器與子代選擇器區別：
後代選擇器：作用在子代和子代所包含的與其相同標籤的所有元素
子選擇器：只作用到子代，子代所包含的所有標籤都不會作用到
7.清除節點