Javascript 不能改变 CSS 颜色

Question

大家好，我是 Javascript 的新手，我只是想制作一个虚拟股票模拟器。我刚刚完成了主要股票，我只是觉得当价格上涨时价格会变绿，当价格下跌时价格会变红会很酷，这就是我遇到问题的地方，代码不会运行，文本甚至不会显示。代码如下。 The full code including HTML and CSS iS on JSfiddle (only the Javascript part is below, and the color changing parts are currently commented out , but you can just uncomment it on JSfiddle .

(function () {
var Stock1 = document.getElementById("RBC");
var Stock2 = document.getElementById("TeslaM");
var Stock3 = document.getElementById("SpaceX");
var submitDay = document.getElementById("submitDay");
var AmountOf = document.getElementById("AmountOf");
Stock1.addEventListener("click", RBC, false);
Stock2.addEventListener("click", TeslaM, false);
Stock3.addEventListener("click", SpaceX, false);
submitDay.addEventListener("click", Days, false);

function Days() {
    days = document.getElementById("days").value;
}

function RBC() {
    $("div").empty();
    var Investments = 100000;
    for (day = 1; day <= days; day++) {
        var difference = (Math.random() * (1.05 - 0.95) + 0.95);
        var Investments = (Investments * difference).toFixed(2);
        $("div").append("<p>" + day + ". " + "Your money today " + Investments + "</p>");
        /*if (difference < 1) {
            document.getElementsByTagName("P").style.color = "red";
        } else {
            document.getElementsByTagName("P").style.color = "green";
        }*/
        if (day - 1 === days - 1) {
            AmountOf.innerHTML = "Amount of money you have: " + "$" + Investments;
        }
    }
}

function TeslaM() {
    $("div").empty();
    var Investments = 100000;
    for (day = 1; day <= days; day++) {
        var difference = (Math.random() * (1.2 - 0.8) + 0.8);
        var Investments = (Investments * difference).toFixed(2);
        $("div").append("<p>" + day + ". " + "Your money today " + Investments + "</p>");
        /*if (difference < 1) {
            document.getElementsByTagName("P").style.color = "red";
        } else {
            document.getElementsByTagName("P").style.color = "green";
        }*/
        if (day - 1 === days - 1) {
            AmountOf.innerHTML = "Amount of money you have: " + "$" + Investments;
        }

    }
}

function SpaceX() {
    $("div").empty();
    var Investments = 100000;
    for (day = 1; day <= days; day++) {
        var difference = (Math.random() * (1.4 - 0.6) + 0.6);
        var Investments = (Investments * difference).toFixed(2);
        $("div").append("<p>" + day + ". " + "Your money today " + Investments + "</p>");
        /*if (difference < 1) {
            document.getElementsByTagName("P").style.color = "red";
        } else {
            document.getElementsByTagName("P").style.color = "green";
        }*/
        if (day - 1 === days - 1) {
            AmountOf.innerHTML = "Amount of money you have: " + "$" + Investments;
        }
    }
}
})();

请不要笑它有多糟糕，正如我所说的，我对整体编程非常陌生。

Answer 1

getElementsByTagName(注意 Elements 的复数形式)返回一个 HTML 集合(它是一个类似数组的对象)，而不是单个 HTML 元素。

你不能设置它的style，你必须遍历它并设置其中每个HTML元素的style。