纯JavaScript替代jQuery的.not（）

从jQuery到.not()的JS替代品是什么？ 我有$(".form :input").not ，但需要将它转移到纯JS。 有没有可以帮助我的指南？

  var input = $(".form :input").not('button, [type="button"], [type="submit"]').on({ input: return }); 

我希望在JS中这样做

Answer 1

普通JS中的等价物就是这样的

 var forms = document.querySelectorAll('.form'), inputs = []; for (var i = forms.length; i--;) { var els = forms[i].querySelectorAll('input, textarea, select'); for (var j = els.length; j--;) { if (els[j].type != 'button' && els[j].type != 'submit') { inputs.push(els[j]); els[j].addEventListener('input', cback, false); } } } function cback(event) { var b = []; for (var i = inputs.length; i--;) { if (!inputs[i].value.length) b.push(inputs[i]); } var l1 = b.length; var l2 = inputs.length; var top = document.querySelectorAll('.top'); for (var j = top.length; j--;) { top[j].style.width = 100 - (l1 / l2) * 100 + "%"; } } 

小提琴

Answer 2

现代浏览器支持querySelectorAll()的NOT子句：

 document.querySelectorAll(".form :input:not(...)"); 

示例（ jsFiddle ）：

 
This should be colored!
 
This should be colored!
 
This must not colored!
 
This should be colored!
 
This should be colored! 

 var matchedElements = document.querySelectorAll("div:not(#this-not)"); for (var i=0; i 

Answer 3

您还可以使用.filter()来排除数组中的项目。 您可以像这样使用它（来自MDN的示例）：

 function isBigEnough(element) { return element >= 10; } var filtered = [12, 5, 8, 130, 44].filter(isBigEnough); // filtered is [12, 130, 44] 

所有现代浏览器和IE9 +都支持它。 有关更多信息，请参阅MDN上的Array.prototype.filter（） 。

不幸的是.filter()仅适用于Arrays，所以我们必须做一些额外的操作来过滤NodeList 。

HTML：

 
 
1
 
2
 
3
 
4
 
5
  

使用Javascript：

 var filter = Array.prototype.filter; var excludeByClassName = function(className) { return function (element) { return element.className != className; }; }; var LIs = document.getElementsByTagName('li'); // [li, li, li.not-me, li, li] var filteredLIs = filter.call(LIs, excludeByClassName('not-me')); // [li, li, li, li] 

有关工作示例，请参阅此jsFiddle 。