如何选择没有类别组合的元素？

Question

I am working on the following code. 我正在研究以下代码。 How can I hide only the divs which has not the classes as indicated in the mopt[] ? 如何仅隐藏不具有mopt[]指示的类的div？

As you can see I am trying to show only two divs which has the Q and M classes but my code in hiding all of divs 如您所见，我试图仅显示两个具有Q和M类的div，但我的代码隐藏了所有div

 $('.AWB').css("background-color", "red"); let mopt = ['Q','M'] for (i = 0; i < mopt.length; i++) { $(".box:not(:has(" + mopt[i] + "))").hide() }

 .box { height: 20px; background: khaki; width: 100px; text-align:center; }

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div class="box ABFRWQ">Has Q</div> <div class="box ABFHKF">No Q</div> <div class="box ABFWR">No Q</div> <div class="box ABFHKF">No Q</div> <div class="box ABFWRM">Has M</div> <div class="box ABFHKF">No Q</div> <div class="box ABQFHMKF">Has Q & M</div>

Answer 1

you can simply use this code.. 您可以简单地使用此代码。

 $('.AWB').css("background-color", "red"); $(".box").not(".Q,.M").hide();

 <!DOCTYPE html> <html> <head> <title>demo</title> <style type="text/css"> .box { height: 20px; background: khaki; width: 100px; text-align:center; } </style> </head> <body> <div class="box ABFRWQ">Has Q</div> <div class="box ABFHKF">No Q</div> <div class="box ABFWR">No Q</div> <div class="box ABFHKF">No Q</div> <div class="box ABFWRM">Has M</div> <div class="box ABFHKF">No Q</div> <div class="box ABQFHMKF">Has Q & M</div> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <script type="text/javascript" src="app.js"></script> </body> </html>

Answer 2

You're looking to hide boxes that have neither Q nor M , so you can filter on those that do not have .Q, .M , and hide those. 您正在寻找隐藏既没有Q也没有M框，因此您可以过滤没有.Q, .M框并隐藏它们。

 $('.AWB').css("background-color", "red"); let mopt = ['Q','M']; $('.box').not( mopt.map(function(className){ return '.'+ className; }).join(', ') ).hide();

 .box { height: 20px; background: khaki; width: 100px; text-align:center; }

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div class="box ABFRWQ">Has Q</div> <div class="box ABFHKF">No Q</div> <div class="box ABFWR">No Q</div> <div class="box ABFHKF">No Q</div> <div class="box ABFWRM">Has M</div> <div class="box ABFHKF">No Q</div> <div class="box ABQFHMKF">Has Q & M</div>

如何选择没有类别组合的元素？

问题描述

2 个解决方案

解决方案1
1 2019-04-12 18:19:46

解决方案2
0 已采纳 2019-04-12 18:00:50

如何选择没有类别组合的元素？

问题描述

2 个解决方案

解决方案1 1 2019-04-12 18:19:46

解决方案2 0 已采纳 2019-04-12 18:00:50

解决方案1
1 2019-04-12 18:19:46

解决方案2
0 已采纳 2019-04-12 18:00:50