javascript - “未定义”不是对象

Question

我有一个看起来像这样的 div：

<em id="ProductPrice" class="ProductPrice VariationProductPrice">$75.00</em>

如果文本的值发生变化，我需要使文本的颜色发生变化。

我写了这个：

<script>

$(document).ajaxSuccess(function(){

    var currentPrice = $.trim($("#ProductPrice").text());

    if(currentPrice == "%%GLOBAL_ProductPrice%%") 
    {
            $("#ProductPrice").style.color="black";
            console.log("black");
    }
    else
    {
            $("#ProductPrice").style.color="red";
            console.log("red");
    }

});

%%GLOBAL_ProductPrice%% 是我们 CMS 中的一个变量，它在任何更改发生之前给出基值。

我收到错误 'undefined' is not an object (evalating '&("#ProductPrice").style.color="red"')

我究竟做错了什么？

Answer 1

您在纯 Javascript 中使用 jQuery 选择器，将无法正常工作。在 javascript 中，您可以更改属性style，在 jQuery 中，您有一个方法.css()来执行此操作。

试试这个：

$("#ProductPrice").css('color','black');

或纯 javascript

document.getElementById('ProductPrice').style.color="black";

Answer 2

jQuery 对象没有名为style. 您正在混合使用 jQuery 和本机 js。试试这个：

$("#ProductPrice").css('color', 'black');

Answer 3

$(selector)

给你一个 jQuery 对象，而不是你会尝试调用 .style 的 HTMLElement。

试试这个：

 $("#ProductPrice").css("color", "red");