本文實例講述了jQuery中復合選擇器簡單用法。分享給大家供大家參考，具體如下：

一 介紹

復合選擇器將多個選擇器（可以是ID選擇器、元素選擇或是類名選擇器）組合在一起，兩個選擇器之間以逗號“，”分隔，只要符合其中的任何一個篩選條件就會被匹配，返回的是一個集合形式的jQuery包裝集，利用jQuery索引器可以取得集合中的jQuery對象。

多種匹配條件的選擇器并不是匹配同時滿足這幾個選擇器的匹配條件的元素，而是將每個選擇器匹配的元素合并后一起返回。
復合選擇器的使用方法如下：

$(" selector1,selector2,selectorN");

selector1：為一個有效的選擇器，可以是ID選擇器、無素選擇器或是類名選擇器等。

selector2：為另一個有效的選擇器，可以是ID選擇器、無素選擇器或是類名選擇器等。

selectorN：（可選擇）為任意多個選擇器，可以是ID選擇器、無素選擇器或是類名選擇器等。

例如，要查詢文檔中的全部的<span>標記和使用CSS類myClass的<div>標記，可以使用下面的jQuery代碼：

$("span,div.myClass");

二 應用

在頁面添加3種不同元素并統一設置樣式。使用復合選擇器篩選<div>元素和id屬性值為span的元素，并為它們添加新的樣式。

三 代碼

<script language="javascript" src="JS/jquery-3.1.1.min.js"></script><p class="default">p元素</p><div class="default">div元素</div><span class="default" id="span">ID為span的元素</span><input type="button" value="為div元素和ID為span的元素換膚" /><script type="text/javascript">$(document).ready(function(){  $("input[type=button]").click(  function() //綁定按鈕的單擊事件  {    var myClass = $("div,#span");   //選取DOM元素    myClass.css("background-color","#C50210");  //為選取的DOM元素設置背景顏色    myClass.css("color","#FFF");  //為選取的DOM元素設置文字顏色  });});</script>

四 運行效果

更多關于jQuery相關內容感興趣的讀者可查看本站專題：《jQuery頁面元素操作技巧匯總》、《jQuery常見事件用法與技巧總結》、《jQuery常用插件及用法總結》、《jQuery擴展技巧總結》及《jquery選擇器用法總結》

希望本文所述對大家jQuery程序設計有所幫助。