jQuery多項選擇器模式:
$("selector1,selector2,selectorN");
將每一個選擇器匹配到的元素合並后一起返回,可以指定任意多個選擇器,並將匹配到的元素合並到一個結果內。
示例代碼:
<!DOCTYPE html> <html> <head lang="zh-CN"> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no"> <title>多項選擇器</title> <style></style> </head> <body> <div id="one" class="number">1</div> <div id="two" class="string">2glass</div> <div id="three" class="string">3monkey</div> <div id="four" class="number">4</div> <script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.js"></script> <script type="text/javascript"> $(document).ready(function() { //此處填寫代碼 var a=$('#one,.string,div'); console.log(a); }); </script> </body> </html>
控制台打印結果:
id選擇器“#one”和clas選擇器“.string”所選擇的元素包含在元素選擇器“div”內,但是jQuery多項選擇器的最終結果是所有元素集合按照html文檔流中的順序進行排列。
可以手動試試選擇器的代碼順序更改后,最終元素集合的順序是否改變?
var a=$('.string,#one,div');
console.log(a);