Question

我在尝试编辑状态DIV时遇到奇怪的错误。

styleBox（）函数应该通过更改颜色和backgroundColor来编辑状态DIV。但是每次运行该函数时都会出现此错误：

TypeError: Cannot set property 'backgroundColor' of undefined

这对我没有意义，因为当我看到我是否正确选择了div时，我没有得到未定义的错误：

document.getElementById('status');
>> <div id="status" style></div>

我认为它与＆＃34; style＆＃34;有关。在状态DIV但不知道如何继续。我看了here但这与选择类而不是ID有关。

我的代码如下：

<!DOCTYPE html>
<html>
    <head>
        <title>
            Day 11 - Functions Visuals
        </title>

        <style>
            #box {
                width:200px;
                height:200px;
                background-color:black;
            }
        </style>
    </head>

    <body>
        <div id="group">
            <button id="blue">Blue</button>
            <button id="red">Red</button>
            <button id="green">Green</button>
            <div id="status" style=""></div> << -- This is what is tripping me up
        </div>

        <div id="box"></div>

        <script type="text/javascript">



            // Create variables for each id

            blueButton = document.getElementById('blue');
            redButton = document.getElementById('red');
            greenButton = document.getElementById('green');
            status = document.getElementById('status');
            box = document.getElementById('box');

            function styleBox() {

                box.style.width = "50px";
                box.style.height = "50px";
                status.innerHTML = "The box is changed";
                status.style.backgroundColor = "#000000";
                status.style.color = "#FFF";
            };


        </script>
    </body>
</html>

Answer 1

回答我自己的问题，

Javascript保留了不能将这些保留字用作变量，标签或函数名的单词。

其中一个词是＆＃34; status＆＃34;我将其命名为我的一个变量。更改变量名后，我的代码工作了。

有关保留字的列表，请选中this列表。

TypeError：无法设置属性＆＃39; backgroundColor＆＃39;未定义的

1 个答案: