JQuery 选择具有自定义属性的元素

标签 jquery html

进一步我的old question ,我必须选择显示顺序不是“-1”的所有行。

<table id="t01">
  <tr>
    <th>HEAD 1</th>
    <th>HEAD 2</th>     
    <th>HEAD 3</th>
  </tr>
  <tr id="Grp1" display-order="0">
    <td>Grp1 data</td>
    <td>Grp1 data</td>      
    <td>Grp1 data</td>
  </tr>
  <tr>
    <td>Grp1 data</td>
    <td>Grp1 data</td>      
    <td>Grp1 data</td>
  </tr>
  <tr>
    <td>Grp1 data</td>
    <td>Grp1 data</td>      
    <td>Grp1 data</td>
  </tr>
  <tr id="Grp2" display-order="-1">
    <td>Grp2 data</td>
    <td>Grp2 data</td>      
    <td>Grp2 data</td>
  </tr>
  <tr>
    <td>Grp2 data</td>
    <td>Grp2 data</td>      
    <td>Grp2 data</td>
  </tr>
  <tr>
    <td>Grp2 data</td>
    <td>Grp2 data</td>      
    <td>Grp2 data</td>
  </tr>
<tr id="Grp3" display-order="0">
    <td>Grp3 data</td>
    <td>Grp3 data</td>      
    <td>Grp3 data</td>
  </tr>
  <tr>
    <td>Grp3 data</td>
    <td>Grp3 data</td>      
    <td>Grp3 data</td>
  </tr>
  <tr>
    <td>Grp3 data</td>
    <td>Grp3 data</td>      
    <td>Grp3 data</td>
  </tr>...
</table>

我的问题是:

  • 如何选择全部<tr>display-order ,但是display-order不应该是-1?
  • 我知道我可以使用.not( "[display-order='-1']" ) ,但我不明白我怎样才能得到tr与任何display-order

    $("[display-order='What_Value_Would_Go_Here?']").not("[display-order='-1']");
    

最佳答案

实现此目的的一种方法是使用 .each() 循环并检查每个选定元素的自定义属性。

工作代码片段:

$("[display-order]").each(function(item){
  if($(this).attr('display-order') !== '-1')
    console.log('found');
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table id="t01">
  <tr>
    <th>HEAD 1</th>
    <th>HEAD 2</th>     
    <th>HEAD 3</th>
  </tr>
  <tr id="Grp1" display-order="0">
    <td>Grp1 data</td>
    <td>Grp1 data</td>      
    <td>Grp1 data</td>
  </tr>
  <tr>
    <td>Grp1 data</td>
    <td>Grp1 data</td>      
    <td>Grp1 data</td>
  </tr>
  <tr>
    <td>Grp1 data</td>
    <td>Grp1 data</td>      
    <td>Grp1 data</td>
  </tr>
  <tr id="Grp2" display-order="-1">
    <td>Grp2 data</td>
    <td>Grp2 data</td>      
    <td>Grp2 data</td>
  </tr>
  <tr>
    <td>Grp2 data</td>
    <td>Grp2 data</td>      
    <td>Grp2 data</td>
  </tr>
  <tr>
    <td>Grp2 data</td>
    <td>Grp2 data</td>      
    <td>Grp2 data</td>
  </tr>
<tr id="Grp3" display-order="0">
    <td>Grp3 data</td>
    <td>Grp3 data</td>      
    <td>Grp3 data</td>
  </tr>
  <tr>
    <td>Grp3 data</td>
    <td>Grp3 data</td>      
    <td>Grp3 data</td>
  </tr>
  <tr>
    <td>Grp3 data</td>
    <td>Grp3 data</td>      
    <td>Grp3 data</td>
  </tr>
</table>

关于JQuery 选择具有自定义属性的元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27704444/

相关文章:

html - CSS 不能与 HTML 标签一起正常工作

javascript - 我如何从该脚本中获取脚本文件名?

javascript - Document.write 替代方案示例

javascript - CSS伪元素混淆

javascript - 无法以编程方式触发 jQuery 单击事件

jquery - fullCalendar 字体大小

javascript 检查键是否被单击

jquery - 如何处理 jquery 动态生成的下拉菜单上的 onchange 事件

javascript - 如何避免旋转时自动左对齐?

css - 奇怪的 float div 行为