Question

我有一种情况需要根据POP的“开启窗口”是否在其上定义了样式类，在POPUP上应用样式。

<html>
   <body class="myClass"> 
     <input type="button" onClick="Open('xyz.html')"/>
   </body>
</html>

现在xyz.html我希望有一个CSS选择器，可根据parent.html class="myClass"来切换某些样式。

没有Jquery可以吗？

如果没有：我有什么替代方案，包括Jquery和Javascript？

请注意：parent.html正在打开xyz.html，它们都是独立的窗口。

Answer 1

您不需要使用jQuery来检查它。你可以使用简单的CSS。检查下面的代码。在此处，如果container具有类my-class。 background-color的属性将应用于弹出窗口。否则，它不会。检查代码并尝试在my-class中使用container时使用相同的内容。

$('button').on('click', function() {
  $('.popup').toggleClass('active')
})

.popup {
  padding: 10px;
  border: 1px solid #ddd;
  opacity: 0;
  transition: all 0.8s ease;
}
.popup.active {
  opacity: 1;
}
.container.my-class .popup {
  background-color: red;
  color: #fff;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="container my-class">
  <button>Click</button>
  <div class="popup"> HAI </div>
</div>

弹出窗口的父体选择器

1 个答案: