如何根据值更改CSS样式

Question

我有一个布尔数组，我在剃刀 foreach 循环中显示。在循环中，我显示数组中的不同值。是否有可能，如果可以，如何根据它显示的值更改 css？

例如

if (@status == true) THEN color = green; if (@status == false) THEN color = red.

原文由 Matthew Czajka 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

如果我正确理解您的问题，您可以向 HTML 元素添加一个数据属性并将值（例如使用 Javascript）更改为“true/false”，然后在您的 CSS 中使用它，如下所示：

 <element data-status="true">Content</element>
<element data-status="false">Content</element>

[data-status="true"] {
    color: green;
}
[data-status="false"] {
    color: red;
}

原文由 Marco Hengstenberg 发布，翻译遵循 CC BY-SA 3.0 许可协议

Answer 2

 $('.test').each(function() {
  if(parseInt($(this).css('font-size')) > 16) {
    $(this).css('color', 'green');
  }
});

 .test {
  font-size: 18px;
  color: red;
}

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<p class="test">Javascript manipulation: Green when largen than 16px</p>

原文由 Nick De Jaeger 发布，翻译遵循 CC BY-SA 3.0 许可协议