javascript - 使用 JavaScript 三元运算符的 CSS 规则

Question

如何使用 javascript 三元运算符将条件设置为 jquery 变量“my_color”来打乱 div id 的 css 规则

j查询:

<script type="text/javascript">
  $(document).ready(function() {
      $("#my_div")
     .removeClass("horizontal vertical")
     .addClass( ['red', 'blue', 'green', 'gray'].indexOf(my_color) != -1 ? 'horizontal' : 'vertical');
});
</script>

如上所述，我的类(class)将 "my_color" 的特定颜色值从水平方向调整为垂直方向作为条件。对于相同的条件，我想将列表项的 float 从 left 与 horizo​​ntal 到 none 与 vertical.my css样式表包含列表项“#my_div li”。

CSS:

#my_div li{float:left}

以及如何使用相同的三元条件运算符来打乱多个 css？

Answer 1

你的意思是像这样吗？

<style>
.float_left { float:left; }
.float_none { float:none; }
</style>
<script type="text/javascript">
  $(document).ready(function() {
      $("#my_div")
     .removeClass("horizontal vertical float_left")
     .addClass( ['red', 'blue', 'green', 'gray'].indexOf(my_color) != -1 ? 'horizontal float_left' : 'vertical float_none');
});
</script>