Question

我有javascript片段：

<div id="store_stock_display"><p>Stock: <span class="store_product_stock"></span></p></div>
<script type="text/javascript">
    $(function() {
        $('.store_product_stock').change(function() {
            if ($(this).text() == '0') {
                $('#store_stock_display').show();
                $(this).text('OUT OF STOCK');
            } else if ($(this).text() == '') {$('#store_stock_display').hide();} else {$('#store_stock_display').show();}
        });
    });
</script>

如果我的产品现货供应，则显示库存水平（例如：10,100 ...）如果我的产品目前缺货，则显示库存。

我想要注意的是造型为：

<font style="color:red; font-weight:bold;">OUT OF STOCK</font>
or
<div class="abc">OUT OF STOCK</div>

请帮助我，非常感谢你！

Answer 1

您可以使用addClass()：

.abc {
    color:red; 
    font-weight:bold
}

 if ($(this).text() == '0') {
      $('#store_stock_display').show();
      $(this).addClass('abc').text('OUT OF STOCK')
 }

W3C：HTML与CSS的分离使得维护网站，跨页面共享样式表以及将页面定制到不同环境变得更加容易。这被称为结构（或：内容）与呈现的分离。

Answer 2

如果你的逻辑完美，你可以选择：

$(this).css({'color': 'red', 'font-weight' : 'bold'});

在添加文字后添加此行。

使用javascript输出样式通知

2 个答案: