jQuery 選擇器 (selector1,selector2,selectorN)

2018-11-23 16:37 更新

jQuery 選擇器 (selector1,selector2,selectorN)

jQuery 選擇器 jQuery 選擇器


定義和用法

jQuery 的selector1,selector2,selectorN選擇器(聯(lián)合選擇器)用于將多個(gè)不同選擇器獲取的元素合并到一起,將其封裝為jQuery對(duì)象并返回。


語法

// 這里的selector1、selector2、selectorN都是具體的選擇器
jQuery( "selector1, selector2 [, selectorN...]" )

參數(shù)

參數(shù)描述
selector1一個(gè)有效的選擇器。
selector2另一個(gè)有效的選擇器。
selectorN可選其他的有效選擇器,可以有任意多個(gè)。

返回值

返回封裝了通過各個(gè)選擇器查找的DOM元素的jQuery對(duì)象。

jQuery先根據(jù)每個(gè)選擇器單獨(dú)去查找對(duì)應(yīng)的DOM元素,并且將所有選擇器查找的DOM元素合并到一起,并將其封裝為jQuery對(duì)象。

如果所有的選擇器都找不到任何匹配的DOM元素,則返回一個(gè)空的jQuery對(duì)象。


實(shí)例

實(shí)例

以下面這段代碼為例:

/* HTML代碼 */
<div id="n1">
    <p id="n2" class="test"></p>
    <p id="n3" class="detail">
        <span id="n4" class="test codeplayer"></span>
    </p>
</div>

/* jQuery代碼 */
<script>
// 擴(kuò)展jQuery對(duì)象,添加showTagInfo()方法
// 用于將jQuery對(duì)象所有匹配元素的標(biāo)識(shí)信息追加到body元素內(nèi)
// 每個(gè)元素的標(biāo)識(shí)信息形如:"tagName"或"tagName#id"
jQuery.fn.showTagInfo = function(){
var tags = this.map( function(){
return this.tagName + ( this.id ? "#" + this.id : "" ); 
} ).get();
$("body").append( tags.join("<br>") + "<br><br>" );
};

// 選擇匹配選擇器"#n1"、 "#n2"或"span.test"三者之一的所有元素
// 本示例中選擇了id分別為n1、n2、n3的三個(gè)元素
$("#n1,#n2,span.test").showTagInfo();

// 選擇匹配選擇器"p.detail"或".test"兩個(gè)之一的所有元素
// 本示例中選擇了id分別為n3、n2、n4的三個(gè)元素
$("p.detail, .test").showTagInfo();

/* 相當(dāng)于多個(gè)選擇器匹配的結(jié)果相加(相同元素只保留一個(gè)) */
</script>

嘗試一下 ?

點(diǎn)擊 "嘗試一下" 按鈕查看在線實(shí)例


jQuery 選擇器 jQuery 選擇器

以上內(nèi)容是否對(duì)您有幫助:
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號(hào)
微信公眾號(hào)

編程獅公眾號(hào)