如何使用jquery選擇多個HTML元素

我想選擇使用jQuery所有li元素與id = result-XX是活動的（class = .... active）。如何使用jquery選擇多個HTML元素

的HTML頁面有：

<li id="result-1" class="list-group-item hover active"> 
</li> 
<li id="result-2" class="list-group-item hover"> 
</li> 
<li id="result-3" class="list-group-item hover"> 
</li>

我曾嘗試以下（僅適用於選擇結果列表中），但它不工作：

console.log("Result: " + $('li[id^="result-1"').length); 
console.log("Result: " + $("li:contains('result-')").length); 
console.log("Result: " + $("li[id~='result-']").length);

然後，我們需要得到的只有活躍的。

來源

2014-02-17 er_benji

$（ 'li.active [ID^= 「result-」]'）將做的工作 –

第一個應該可以工作，但是你的選擇器是錯誤的。它應該是$('li[id^="result-"]')。

您可以使用$('li[id^="result-"]').filter(".active")將設置降低到只有active，例如，

var elements, activeElements; 
elements = $('li[id^="result-"]'); 
activeElements = elements.filter(".active");

見http://api.jquery.com/filter/

來源

2014-02-17 12:55:17

缺少方括號？同樣的原因，爲什麼第一個不會工作 –

@ jenson-button-event爲什麼你不會在我的文章中提交該編輯。這是一個有效的權利。？缺少方括號。？ –

@Raj - erm不確定你的意思，有人在實際文章中留下了一些關於缺少的方括號的評論，這實際上是在那裏 - 所以我刪除了它們。 '$（'li [id^=「result - 」]。active'）'就是我所看到的 –

您必須結合attribute starts with selector和class selector才能完成您的任務。

嘗試，

$('li[id^="result-"].active')

來源

2014-02-17 12:49:16

@downvoters：這有什麼錯在我的代碼？提供一個機會來糾正我的錯誤。 –

爲什麼這些投下來，這是一個合法的問題 –

@Oly謝謝..這是一個錯字。真的非常感謝您指出錯誤。 –

讓我們分解所需要的選擇：

li - 這將匹配所有li元素。 Element selector
[id^="result-"] - 這將匹配id屬性以result-開頭的所有元素。 Starts with selector。
.active - 這將匹配所有具有active類的元素。 Class selector

，結合它們會給你最後的選擇，你需要：

var elements = $('li.active[id^="result-"]');

爲了讓這多一點的可讀性，我建議這樣寫的：

var elements = $('li[id^="result-"]').has('.active');

這使用has()過濾器將匹配元素的集合減少到只有那些誰hav eactive類。

來源

2014-02-17 12:52:18 Lix

第一部分是確定的。我不知道爲什麼，但「.has（'.active'）」方法不起作用。結合奧利霍奇森的建議（.filter），它工作正常。謝謝。 –

如何使用jquery選擇多個HTML元素

回答

相關問題