一:核心部分
$(expr)
說明:該函數可以通過css選擇器,Xpath或html代碼來匹配目標元素,所有的jQuery操作都以此為基礎
參數:expr:字符串,一個查詢表達式或一段html字符串
例子:
未執行jQuery前:
<p>one</p>
<div>
<p>two</p>
</div>
jQuery代碼及功能:
運行:當點擊id為test的元素時,彈出對話框文字為two,即div標簽下p元素的內容
運行:當點擊id為test的元素時,向body中添加“<div><p>Hello</p></div>”
$(elem)
說明:限制jQuery作用于一個特定的dom元素,這個函數也接受xml文檔和windows對象
參數: elem:通過jQuery對象壓縮的DOM元素
例子:
未執行jQuery前:
jQuery代碼及功能:
運行:當點擊id為test的元素時,彈出對話框文字為two,即div標簽下p元素的內容
運行:當點擊id為test的元素時,背景色變成黑色
$(elems)
說明:限制jQuery作用于一組特定的DOM元素
參數: elem:一組通過jQuery對象壓縮的DOM元素
例子:
未執行jQuery前:
<form id="form1">
<input type="text" name="textfield">
<input type="submit" name="Submit" value="提交">
</form>
<a href="#" id="test" onClick="jq()">jQuery</a>jQuery代碼及功能:
運行:當文檔載入時背景變成黑色,相當于onLoad。
$(obj)
說明:復制一個jQuery對象,
參數:obj (jQuery): 要復制的jQuery對象
例子:
未執行jQuery前:
jQuery代碼及功能:
運行:當點擊id為test的元素時,彈出對話框文字為two,即div標簽下p元素的內容。
each(fn)
說明:將函數作用于所有匹配的對象上
參數:fn (Function): 需要執行的函數
例子:
未執行jQuery前:
jQuery代碼及功能:
運行:當點擊id為test的元素時,img標簽的src都變成了2.jpg。
eq(pos)
說明:減少匹配對象到一個單獨得dom元素
參數:pos (Number): 期望限制的索引,從0 開始
例子:
未執行jQuery前:
<p>This is just a test.</p>
<p>So is this</p>
<a href="#" id="test" onClick="jq()">jQuery</a>jQuery代碼及功能:
運行:當點擊id為test的元素時,alert對話框顯示:So is this,即第二個<p>標簽的內容
get() get(num)
說明:獲取匹配元素,get(num)返回匹配元素中的某一個元素
參數:get (Number): 期望限制的索引,從0 開始
例子:
未執行jQuery前:
jQuery代碼及功能:
運行:當點擊id為test的元素時,alert對話框顯示:So is this,即第二個<p>標簽的內容
注意get和eq的區別,eq返回的是jQuery對象,get返回的是所匹配的dom對象,所有取$("p").eq(1)對象的內容用jQuery方法html(),而取$("p").get(1)的內容用innerHTML
index(obj)
說明:返回對象索引
參數:obj (Object): 要查找的對象
例子:
未執行jQuery前:
jQuery代碼及功能:
運行:當點擊id為test的元素時,兩次彈出alert對話框分別顯示0,1
size() Length
說明:當前匹配對象的數量,兩者等價
例子:
未執行jQuery前:
jQuery代碼及功能:
運行:當點擊id為test的元素時,彈出alert對話框顯示2,表示找到兩個匹配對象
新聞熱點
疑難解答