$()函數是JQuery函數的別稱,就是一種標志,符合其思想:write less,do more。第一次接觸可能有些不適應,是jQuery代碼佶屈聱牙,晦澀難懂。我們需要適應一段時間,過一段時間,就會愛上其簡潔,方便,飛起來。
$()函數用于將任何對象包裹成jQuery對象,接著就可以被允許調用定義在jQuery對象上的多個不同方法。甚至可以將一個選擇器字符串傳入 $()函數,它會返回一個包含所有匹配的DOM 元素數組的jQuery對象。可以用each()方法進行遍歷里面的對象。
這個問題是jQuery基于選擇器的。jQuery支持不同類型的選擇器,有 ID選擇器、class選擇器、標簽選擇器。這個問題的答案是使用標簽選擇器來選擇所有的div元素。jQuery代碼:
$("div").
其返回值是一個包含5個div標簽的jQuery對象。
ID選擇器使用ID來選擇元素,例: $("#idtest1"). 而 class選擇器使用CSS class 來選擇元素,例:$(".classtest1")。當只需要選擇一個元素時,使用ID選擇器,如果需要選擇具有相同 CSS class的元素,就要用class 選擇器。
這里和CSS里的標記符合 (#,.) 是一 一 對應的。
此功能是jQuery的事件處理問題。jQuery為按鈕點擊之類的事件提供了很好的支持。可以通過ID或class選擇器定位到圖片,并將按鈕綁定事件,再執行hide()方法。
ready( ) 函數用于在文檔進入ready狀態時執行代碼。當DOM完全加載(HTML被完全解析DOM樹構建完成時),jQuery允許我們的執行代碼。使用$(document).ready()的最大好處在于它適用于所有瀏覽器,jQuery幫我們解決了跨瀏覽器的問題。
前者,window.onload( ) 事件需要等待 DOM被創建,還要等待包括 大型圖片、音頻、視頻等 所有的外部資源全部都加載完全,才能執行;
如果圖片、視頻等內容的加載花費時間過多,就會有明顯的延遲。更嚴重的是使用戶感受到。。。say byebye。。。
后者,$().ready( ) 函數,只需要等待DOM樹的建立完成,而不需要等待圖片、音頻、視頻的大型文件的加載,從而執行的會更快。
再有,在網頁中可以多次使用ready( ) ,瀏覽器會按照其在HTML頁面里出現的順序執行,而onload只執行一次。
表單選擇器與屬性選擇器的應用
我們使用選擇器進行選擇時,例如涉及到選擇class的相關操作,其返回值是jQuery數組,我們想要獲取數組中的每一個值,這是就要用到each()函數了。
each()函數類似于Java中集合中遍歷所使用的 Iterator 迭代器,允許我們遍歷一個元素的集合。
可以傳一個函數給each()方法,被調用的jQuery對象會在其每個元素上執行傳入的函數。
這樣就可以遍歷到每個元素了。
jQuery提供了append()、appendTo()等相關方法 可以將一個HTML元素添加到DOM樹中。
相關用法如下
內部(子元素):