Fatal编程技术网
  • javascript/
  • Javascript 如何编辑不包含H1标记的div的CSS？

Javascript 如何编辑不包含H1标记的div的CSS？

javascript jquery css

Javascript 如何编辑不包含H1标记的div的CSS？,javascript,jquery,css,Javascript,Jquery,Css,有两个部门： <div class="test"> <h1>This is a test</h1> <p>Welcome to the test</p> </div> <div class="test"> <p>Welcome to the test</p> </div> 上面显示了div测试的CSS 我想做的是对不包含H1标记的div应用额外的CSS 如果div包含H1标

有两个部门：

<div class="test">
<h1>This is a test</h1>
<p>Welcome to the test</p>
</div>

<div class="test">
<p>Welcome to the test</p>
</div>
上面显示了div
测试的CSS

我想做的是对不包含H1标记的div应用额外的CSS

如果div包含H1标记：


    

  • 无所事事
    • 


如果div不包含H1标记：


    

  • 将以下CSS应用于该特定div
    • 



字体大小：30px


$（'.test:not（：has（h1）））.css（'font-size'，'30px'）

.test{
字体大小：20px；
颜色：#000；
}



这是一个测试
欢迎参加考试

欢迎参加考试


这并不是最好的方法，但是如果您无法编辑html，那么您可以通过执行以下操作来针对CSS：




这真的很不可靠
 @Osman，我不介意人们投反对票，只要他们告诉我为什么！总之，很高兴它起到了作用，谢谢你的投票@Arbel I在tagsDownvote中加入了jQuery，以使用JS编写CSS。这只是一个糟糕的做法，不是一个可靠的答案。@SeanStopnik，一直使用jQuery编写css是标准的。它用于动态情况或纯css选择器难以使用的情况。你介意解释一下为什么这是一种不好的做法吗？首先，在JS中编写CSS不是“标准”的。标记和表示的分离是我们想要的。不使用JS编写CSS的最大原因是关闭JS的用户会发生什么？事实上，html应该反映您正在尝试的样式。给自己一个额外的目标挂钩，比如：
.test.with heading
或类似的东西。您永远不希望css与javascript绑定，反之亦然。把它分开，不错！我喜欢你对使用相邻兄弟姐妹选择器的敏锐眼光

.test {
font-size: 20px;
color: #fff
}



.test {
  font-size: 30px;
  color: #fff;
}

.test h1,
h1 ~ p {
    font-size: 20px;
}