迭代表行（tr）并在JQuery中选择没有特定类的行

Question

我要做的是，能够选择没有特定类名的行，并将它们推送到新数组中。我知道有:not() Selector和.not() method来帮助我。

但最大的问题是我无法将:not() Selector与$(this)一起使用并尝试使用.not() method但无法到达任何地方。

这是我的代码：

$(document).ready(function(){

  $('#getRows').on('click', function() {
    var temp = new Array();
    $('#tbl tr').each(function(){
      var clsFree = $(this).not(document.getElementsByClassName("testCls"));
      temp.push(clsFree);
    });
    console.log(temp.length);
  });

});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button id="getRows">Get rows without class</button>
<table id="tbl">
  <tr class="testCls"><td>Test1</td></tr>
  <tr class="testCls"><td>Test2</td></tr>
  <tr><td>Test3</td></tr>
  <tr class="testCls"><td>Test4</td></tr>
  <tr class="testCls"><td>Test5</td></tr>
  <tr class="testCls"><td>Test6</td></tr>
  <tr><td>Test7</td></tr>
  <tr class="testCls"><td>Test8</td></tr>
  <tr class="testCls"><td>Test9</td></tr>
</table>

  

请注意，此处的主要目标是查找没有testCls类名的行，并将它们推送到新数组中。任何其他方法也不胜感激。

Answer 1

尝试:not()作为.each迭代器中选择器的一部分，仅迭代选择器中的选定行：

$('#tbl tr:not(.testCls)').each(function(){

工作代码段：

$(document).ready(function(){

  $('#getRows').on('click', function() {
    var temp = new Array();
    $('#tbl tr:not(.testCls)').each(function(){
      var clsFree = this;
      temp.push(clsFree);
    });
    console.log(temp.length);
  });

});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button id="getRows">Get rows without class</button>
<table id="tbl">
  <tr class="testCls"><td>Test1</td></tr>
  <tr class="testCls"><td>Test2</td></tr>
  <tr><td>Test3</td></tr>
  <tr class="testCls"><td>Test4</td></tr>
  <tr class="testCls"><td>Test5</td></tr>
  <tr class="testCls"><td>Test6</td></tr>
  <tr><td>Test7</td></tr>
  <tr class="testCls"><td>Test8</td></tr>
  <tr class="testCls"><td>Test9</td></tr>
</table>

Answer 2

两件事：

• 这是.not：$(this).not('.testCls');
的语法
• clsFree将成为一个jQuery，即使其中没​​有元素，jQuerys仍然存在。你必须检查长度，看看是否有任何元素。

另外，你可能最终会对这样的事情感到高兴： $('#tbl tr:not(.testCls)').each...

＆＃13;

＆＃13;

$(document).ready(function() {
    $('#getRows').on('click', function() {
        var temp = new Array();
        $('#tbl tr').each(function() {
            clsFree = $(this).not('.testCls');
            if (clsFree.length > 0)
                temp.push(clsFree);
        });
        console.log(temp.length);
    });

    console.log('other method', $('#tbl tr:not(.testCls)').length);
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
	<button id="getRows">Get rows without class</button>
	<table id="tbl">
		<tr class="testCls"><td>Test1</td></tr>
		<tr class="testCls"><td>Test2</td></tr>
		<tr><td>Test3</td></tr>
		<tr class="testCls"><td>Test4</td></tr>
		<tr class="testCls"><td>Test5</td></tr>
		<tr class="testCls"><td>Test6</td></tr>
		<tr><td>Test7</td></tr>
		<tr class="testCls"><td>Test8</td></tr>
		<tr class="testCls"<td>Test9</tr></tr>
	</table>

＆＃13;

＆＃13;

＆＃13;