jQueryday2容易混淆的知識點，與注意要點
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.清除節點