選擇具有querySelectorAll

我有這樣一段代碼多個元素：如果我想補充的textarea和select到我結束了這個查詢選擇具有querySelectorAll

var requiredFields = el.querySelectorAll("input[required]:not(:disabled):not([readonly]):not([type=hidden])");

：

var requiredFields = el.querySelectorAll("input[required]:not(:disabled):not([readonly]):not([type=hidden])"+ 
",select[required]:not(:disabled):not([readonly]):not([type=hidden])"+ 
",textarea[required]:not(:disabled):not([readonly]):not([type=hidden])");

我感覺說這可能會更好..但如何？

獎勵：請給我一個很好的querySelectorAll函數資源。

來源

2013-12-19 A1rPun

僅供參考，select和textarea元素沒有任何類型屬性。 –

什麼是var'el'？ –

@ShadowWizard你是對的，CopyPasta剩菜。 @Kevin'el' = document.body。 – A1rPun

影子嚮導說，至少可以消除在各個地方的不必要:not([type=hidden])它沒有什麼意義（select和textarea）。

我看不出結果的問題：

var requiredFields = el.querySelectorAll(
    "input[required]:not(:disabled):not([readonly]):not([type=hidden])" + 
    ",select[required]:not(:disabled):not([readonly])"+ 
    ",textarea[required]:not(:disabled):not([readonly])");

......這不僅是因爲它交給了整個事情關閉的選擇器引擎採取任何優化它可以做的優勢。

或者你可以給所有的相關投入一個共同的類，然後使用：

var requiredFields = el.querySelectorAll(
    ".the-class[required]:not(:disabled):not([readonly]):not([type=hidden])");

...但我不知道它給你買了。

請給我一個很好的querySelectorAll函數的資源。

有the specification。 MDN通常也是這個東西的好地方。

來源

2013-12-19 09:42:41

querySelectorAll

window.l = ['input','textarea','select']; 
function myQuerySelectorAll() { 
    q = ''; 
    t = '[required]:not(:disabled):not([readonly]):not([type=hidden])'; 
    l.forEach(function(e) { 
     q += e; 
     q += t; 
     q += ','; 
    }); 
    console.log(q) 
}

$> myQuerySelectorAll(); 
$> input[required]:not(:disabled):not([readonly]):not([type=hidden]),textarea[required]:not(:disabled):not([readonly]):not([type=hidden]),select[required]:not(:disabled):not([readonly]):not([type=hidden]),

來源

2013-12-19 09:42:33 GLES

選擇具有querySelectorAll

回答

相關問題