偷偷摘套内射激情视频,久久精品99国产国产精,中文字幕无线乱码人妻,中文在线中文a,性爽19p

jQuery四大天王:核心函數(shù)詳解

開(kāi)發(fā) 開(kāi)發(fā)工具 前端
本文將帶您了解jQuery中的四個(gè)核心函數(shù),jQuery中的很多核心功能也是通過(guò)函數(shù)來(lái)實(shí)現(xiàn)的,對(duì)于jQuery開(kāi)發(fā)者,這些核心函數(shù)是必須掌握的。

熟練使用jQuery中的函數(shù),能夠大大提高我們的工作效率,jQuery的很多核心功能,也是通過(guò)函數(shù)實(shí)現(xiàn)的。之前51CTO也曾報(bào)道過(guò)《一些應(yīng)該熟記于心的jQuery函數(shù)和技巧》,而本文將帶您了解jQuery的四個(gè)核心函數(shù)。

jQuery(expression,[context])

這個(gè)函數(shù)接收一個(gè)包含 CSS 選擇器的字符串,然后用這個(gè)字符串去匹配一組元素。jQuery的核心功能都是通過(guò)這個(gè)函數(shù)實(shí)現(xiàn)的。 jQuery中的一切都基于這個(gè)函數(shù),或者說(shuō)都是在以某種方式使用這個(gè)函數(shù)。這個(gè)函數(shù)最基本的用法就是向它傳遞一個(gè)表達(dá)式(通常由 CSS 選擇器組成),然后根據(jù)這個(gè)表達(dá)式來(lái)查找所有匹配的元素。

默認(rèn)情況下, 如果沒(méi)有指定context參數(shù),$()將在當(dāng)前的 HTML 文檔中查找 DOM 元素;如果指定了 context 參數(shù),如一個(gè) DOM 元素集或 jQuery 對(duì)象,那就會(huì)在這個(gè) context 中查找。

參數(shù):

expression (String) : 用來(lái)查找的字符串

context (Element, jQuery) : (可選) 作為待查找的 DOM 元素集、文檔或jQuery對(duì)象。

示例

找到所有p元素,并且這些元素都必須是 div 元素的子元素。

HTML代碼:

<p>one</p> <div><p>two</p></div> <p>three</p>

jQuery代碼:

$("div > p");

結(jié)果:

[ <p>two</p> ]

在文檔的***個(gè)表單中,查找所有的單選按鈕(即: type 值為 radio 的 input 元素)。

jQuery代碼:

$("input:radio", document.forms[0]);

在一個(gè)由AJAX返回的 XML 文檔中,查找所有的div元素。

jQuery代碼:

$("div", xml.responseXML);

#p#

jQuery(html,[ownerDocument])

根據(jù)提供的原始 HTML 標(biāo)記字符串,動(dòng)態(tài)創(chuàng)建由 jQuery 對(duì)象包裝的DOM元素。你可以傳遞一個(gè)手寫的 HTML 字符串,或者由某些模板引擎或插件創(chuàng)建的字符串,也可以是通過(guò) AJAX 加載過(guò)來(lái)的字符串。但是在你創(chuàng)建 input 元素的時(shí)會(huì)有限制,可以參考第二個(gè)示例。

當(dāng)然這個(gè)字符串可以包含斜杠 (比如一個(gè)圖像地址),還有反斜杠。當(dāng)你創(chuàng)建單個(gè)元素時(shí),請(qǐng)使用閉合標(biāo)簽或 XHTML 格式。例如,創(chuàng)建一個(gè) span ,可以用 $("<span/>") 或 $("<span></span>") ,但不推薦 $("<span>")。在jQuery 中,這個(gè)語(yǔ)法等同于$(document.createElement("span")) 。

參數(shù):

html (String) : 用于動(dòng)態(tài)創(chuàng)建DOM元素的HTML標(biāo)記字符串

ownerDocument (Document) : 可選,創(chuàng)建DOM元素所在的文檔

示例:

動(dòng)態(tài)創(chuàng)建一個(gè) div 元素(以及其中的所有內(nèi)容),并將它追加到 body 元素中。在這個(gè)函數(shù)的內(nèi)部,是通過(guò)臨時(shí)創(chuàng)建一個(gè)元素,并將這個(gè)元素的 innerHTML 屬性設(shè)置為給定的標(biāo)記字符串,來(lái)實(shí)現(xiàn)標(biāo)記到 DOM 元素轉(zhuǎn)換的。所以,這個(gè)函數(shù)既有靈活性,也有局限性。

jQuery代碼:

$("<div><p>Hello</p></div>").appendTo("body");

創(chuàng)建一個(gè) <input> 元素必須同時(shí)設(shè)定 type 屬性。因?yàn)槲④浺?guī)定 <input> 元素的 type 只能寫一次。

jQuery代碼:

// 在 IE 中無(wú)效:
$("<input>").attr("type", "checkbox");
// 在 IE 中有效:
$("<input type='checkbox'>");

#p#

jQuery(elements)

將一個(gè)或多個(gè)DOM元素轉(zhuǎn)化為jQuery對(duì)象。這個(gè)函數(shù)也可以接收XML文檔和Window對(duì)象(雖然它們不是DOM元素)作為有效的參數(shù)。

參數(shù)

elements (Element, Array<Element>) : 用于封裝成jQuery對(duì)象的DOM元素

示例:

設(shè)置頁(yè)面背景色。

jQuery代碼:

$(document.body).css( "background", "black" );

隱藏一個(gè)表單中所有元素。

jQuery代碼:

$(myForm.elements).hide()

#p#

jQuery(callback)

$(document).ready()的簡(jiǎn)寫。允許你綁定一個(gè)在DOM文檔載入完成后執(zhí)行的函數(shù)。這個(gè)函數(shù)的作用如同$(document).ready()一樣,只不過(guò)用這個(gè)函數(shù)時(shí),需要把頁(yè)面中所有需要在 DOM 加載完成時(shí)執(zhí)行的$()操作符都包裝到其中來(lái)。從技術(shù)上來(lái)說(shuō),這個(gè)函數(shù)是可鏈接的--但真正以這種方式鏈接的情況并不多。

你可以在一個(gè)頁(yè)面中使用任意多個(gè)$(document).ready事件。

參數(shù):

callback (Function) : 當(dāng)DOM加載完成后要執(zhí)行的函數(shù)

示例:

當(dāng)DOM加載完成后,執(zhí)行其中的函數(shù)。

jQuery 代碼:

$(function(){
// 文檔就緒
});

使用$(document).ready() 的簡(jiǎn)寫,同時(shí)內(nèi)部的jQuery代碼依然使用 $ 作為別名,而不管全局的 $ 為何。

jQuery 代碼:

jQuery(function($) {
// 你可以在這里繼續(xù)使用$作為別名...
});

【編輯推薦】

  1. jQuery中10個(gè)強(qiáng)大的遍歷函數(shù)
  2. 改變獲取對(duì)象方式 ***的jQuery選擇器
  3. 一些應(yīng)該熟記于心的jQuery函數(shù)和技巧
  4. jQuery另類視角:動(dòng)態(tài)擴(kuò)展對(duì)象
  5. 了解jQuery技巧來(lái)提高你的代碼質(zhì)量
責(zé)任編輯:王曉東 來(lái)源: googlecode
相關(guān)推薦

2014-03-27 15:57:45

Android組件Activity

2019-10-15 08:00:00

HTTP2HTTP前端

2012-05-10 18:10:35

2018-08-02 14:12:16

影評(píng)分析狄仁杰之四大天王

2020-04-06 20:11:26

區(qū)塊鏈分布式核心技術(shù)

2019-06-05 13:00:36

2023-08-07 07:16:33

AMDNavi 31Navi 31 XL

2010-08-05 10:22:46

Flex效果

2024-10-06 12:40:26

2015-07-17 09:50:16

Carthage優(yōu)劣比較

2024-11-22 14:28:00

2012-03-26 21:52:07

平臺(tái)

2010-06-03 09:09:10

Hadoop

2010-11-15 15:20:13

Oracle索引掃描

2010-07-02 14:34:53

UML類圖

2025-05-08 01:00:00

Nginx算法負(fù)載均衡

2015-08-05 11:32:10

2011-03-21 09:01:49

CSS框架

2009-10-22 10:06:54

CLR線程池教程

2024-03-29 13:30:41

分布式事務(wù)節(jié)點(diǎn)
點(diǎn)贊
收藏

51CTO技術(shù)棧公眾號(hào)