选择具有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

回答

相关问题