一、jQuery對象與JavaScript對象 ①JavaScript入口函數比jQuery入口函數執行的晚一些； JQuery的入口函數會等頁面載入完成才執行，但是不會等待圖片的載入； JavaScript入口函數需要等待頁面載入和圖片載入完成才執行； JavaScript入口函數：window. ...
一、jQuery對象與JavaScript對象
①JavaScript入口函數比jQuery入口函數執行的晚一些；
JQuery的入口函數會等頁面載入完成才執行，但是不會等待圖片的載入；
JavaScript入口函數需要等待頁面載入和圖片載入完成才執行；
JavaScript入口函數：window.onload = function(){}；
JQuery入口函數：①$(document).ready(function(){});
②$(function(){});
②JQuery對象與Dom（JavaScript對象）對象的區別：
DOM對象：使用JavaScript方式獲取到的元素是DOM對象。
JQuery對象：使用JQuery方式獲取到的元素是JQuery對象。
③JQuery對象與DOM對象的聯繫：
1、JQuery對象其實就是JavaScript對象的集合，JQuery對象裡面存放了一大堆JavaScript對象。
2、JQuery對象不能與Dom對象相互調用{$("li").setAttribute("name","he"); //代碼報錯
document.getElementById("section").show();//代碼報錯
}
3、DOM對象轉JQuery對象：
var cloth = document.getElementById("cloth"); //這是DOM對象
$(cloth).innerText("測試");
JQuery對象轉DOM對象：
var $li = $("li");
$li[0].style.backgroundColor = "red"; //利用取下標的方式將JQuery對象轉換成DOM對象
或者$li.get(0).style.backgroundColor = "red"; //利用get()方法也能達到同樣效果
二、JQuery常用方法
①index()方法：返回當前元素在所有兄弟元素當中的索引
<li><a>1</a></li>
<li><a>2</a></li>
<li><a>3</a></li>
$(function(){
$("li").click(function(){
console.log($(this).index());
});
});
②CSS操作
隱式迭代：設置操作的時候會給JQuery內部的所有對象都設置上相同的值，獲取的時候只返回第一個元素對應的值。
addClass()：添加一個類，不影響之前存在的類。
removeClass()：移除一個類。
hasClass()：判斷一個類是否存在。
toggleClass()：切換類，如果類存在就移除，沒有就添加。
③屬性操作
attr(name,value):使用方法$("img").attr("alt","圖片不存在");
對於布爾值類型的屬性，不使用attr()放法，應該使用prop()放法，用法與attr()一樣。
④動畫操作
show(): 可以傳參數，也可不傳參數；不傳參數則沒有動畫效果，參數可以是好毫秒值，也可以是字元串：fast=200ms、normal=40ms、slow=60ms。
hide()：隱藏。
slideDown():向上滑入可接收兩個參數，slideDown(1000,function(){})。
slideUp()：向上滑出。
slideToggle()：如果是滑入狀態就滑出，反之。
fadeIn()：淡入。
fadeOut():淡出。
fadeToggle()：切換淡入淡出。
自定義動畫animate()
1、第一個參數，必填：是一個對象，需要動畫的樣式。
2、第二個參數：執行時間。
3、第三個參數：動畫執行效果。
4、第四個參數：回調函數。
stop()方法：停止當前執行的動畫，一般寫在動畫前面停止別人的動畫立即執行自己的動畫。
1、例如：.stop.slideDown(); //立即執行slideDown()
2、第一個參數：是否清除動畫隊列，ture是；false否。
3、第二個參數：是否跳轉到當前動畫的最終狀態效果：true是，false否。
音樂播放是DOM對象，不能調用eq()，需要使用get()獲取。
⑤創建JQuery對象直接將標簽寫在$()中，JavaScript中使用creatElement創建對象。
append()：添加節點到子元素的最後面。
prepend()：添加節點到子元素的最前面。
appendTo()：把節點添加到父元素中，參數是父元素。
perpendTo()：把節點添加到父元素中的最前面，參數是父元素。
after():添加到父元素的後面。
before()：添加到父元素的前面。
empty()：清空一個元素的內容，並且會把對應的事件也清空。
html("")：把元素內容設置為空，不會清除內容上的事件。
remove()：刪除節點，與empty()是清除子節點；remove是清除自己和後代節點。
clone(): 參數false不會複製內容綁定事件，true同時複製內容綁定事件。
val()：獲取標簽中的內容。
html(): 可以識別標簽，效果與JavaScript中的innerHTML方法相同。
text()：不能識別標簽，效果與JavaScript中innerText相同。
width()：獲取盒子的寬度。
height()：獲取盒子的高度。
innerWidth()：獲取padding+width的值。
outerWidth()：獲取padding+width+border的總值。如果這個方法中傳入參數true就獲取padding+width+border+margin的值。
scrollTop()與scrollLeft()設置或者獲取垂直滾動條的位置。
offset()：獲取元素相對於document的位置。
position()：獲取元素相對於有定位的父元素的位置。
