空或不指定屬性選擇元素

看看下面，簡要的HTML代碼：空或不指定屬性選擇元素

<div> 
    <span id='1' cust-attr='' /> 
    <span id='2' /> 
    <span id='3' cust-attr='Foo' /> 
</div>

現在我正在尋找一個選擇查找所有span S的要麼沒有屬性「卡斯特 - ATTR 「或者其」cust-attr「值爲空。
在這種情況下，這將是1和2

我嘗試，結果如下以下選擇：

span[cust-attr!=]選擇2和3
span[cust-attr='']僅選擇1
span:not([cust-attr])選2
span(:not([cust-attr]),[cust-attr=''])全選三選
span([cust-attr=''],:not([cust-attr]))選擇1

但是，我沒有找到一個選擇只有1和2
你知道的可能？

注意，我想避免：

span:not([cust-attr]),span[cust-attr='']

爲「跨度」在現實中是一個更復雜的表達式。

來源

2011-04-02 Matthias

你給我們品嚐你的複雜表情？ – Zakaria 2011-04-02 15:59:12

請參閱下面的回答評論 - 它用於解析一些第三方HTML。 – Matthias 2011-04-02 16:01:02

基本上不要。

將所有邏輯放入選擇器並不好。它最終將會在計算上非常昂貴（因爲這些部分在解釋之前需要從字符串中解析出來）和混亂。使用filter方法，而不是美：

$('span') 
    .filter(function(){ 
     return !$(this).attr('cust-attr'); 
    });

這將刪除所有元素，其中cust-attr是從選擇一個非空字符串。

來源

2011-04-02 16:11:40 lonesomeday

謝謝！看起來像一個很好，乾淨的方式。 – Matthias 2011-04-02 16:25:03

呵呵？這可能會比較慢，您在每次迭代中構建一個新的jQuery實例。在更現代的瀏覽器（那些支持querySelectorAll的瀏覽器）中選擇器會更快。那麼，請問，這個['cust-attr']'是錯的嗎？ – James 2011-04-02 16:37:15

@ J-P'這['cust-attr']'是不可靠的跨瀏覽器。解決方法是'this ['cust-attr']！= null？這個['cust-attr']：this.getAttribute（'cust-attr'）'，但我沒有使用它，因爲長度過長。[速度差異不是很大]（http://jsperf.com/cust-attr）。 – lonesomeday 2011-04-02 16:44:00

爲什麼不直接選擇所有的SPAN，然後過濾選擇？例如。

$('span').filter('[cust-attr=""],:not([cust-attr])')

來源

2011-04-02 16:11:01 James

也謝謝。看起來不錯:-) – Matthias 2011-04-02 16:26:26

遲到了......

...或者你可以使用CSS Selectors，並10倍一樣快，都jQuery的答案... :)

document.querySelectorAll("input:not([id]), input[id='']");

Proof

來源

2015-08-19 16:27:14 JeffC

這絕對是做到這一點的最佳方式。 – Bowofola 2016-08-11 16:59:55

空或不指定屬性選擇元素

回答

相關問題