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

时间:2019-04-12 17:48:32

标签: javascript jquery

我正在处理以下代码。如何仅隐藏没有 col_2 col_1 col_3 0 3 1 2 1 5 3 3 2 4 3 3 中指示的类的div?

如您所见,我试图仅显示两个具有from datetime import timedelta from discord.ext.commands import Bot bot = Bot(command_prefix="!") last_time = None @bot.event async def on_message(message): global last_time if message.author == bot.user: # ignore our own messages return if message.author.id == ...: if last_time is None or message.created_at - last_time <= timedelta(seconds=5): last_time = message.created_at await message.channel.send("You have spoken") # bot.send_message(message.channel, ...) on async bot.run("TOKEN") mopt[]类的div,但是我的代码隐藏了所有divs

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

2 个答案:

答案 0 :(得分:1)

您只需使用此代码即可。

				
$('.A.W.B').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 A B F  R W Q">Has Q</div>
	<div class="box A B F H K F">No Q</div>
	<div class="box A B F W R">No Q</div>
	<div class="box A B F H K F">No Q</div>
	<div class="box A B F W R M">Has M</div>
	<div class="box A B F H K F">No Q</div>
	<div class="box A B Q F H  M K F">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>

答案 1 :(得分:0)

您要隐藏既没有Q也没有M的框,因此可以过滤没有.Q, .M的框,然后将其隐藏。

$('.A.W.B').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 A B F  R W Q">Has Q</div>
<div class="box A B F H K F">No Q</div>
<div class="box A B F W R">No Q</div>
<div class="box A B F H K F">No Q</div>
<div class="box A B F W R M">Has M</div>
<div class="box A B F H K F">No Q</div>
<div class="box A B Q F H  M K F">Has Q & M</div>