Question

更新：我修复了颜色与backgroundColor问题。谢谢！但是，代码仍然无法从WebStorm运行。那里有任何WebStorm专家吗？

我正在学习javascript并试图用js操纵css。这是我的代码：

＆＃13;

document.getElementById("top-left").style.color = "blue";

＆＃13;

body{
    background-color: black;
}

.container {
    text-align:center;
    position: absolute;
    width: 100%;
    margin: 0 auto;
    padding-top: 2.5%;
    padding-left: 30%;
    width: 31em;
}

#title {
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    width: 50%;
    color: green;
    font-size: 4em;
}

#top-left {
    width: 15em;
    height: 15em;
    background: red;
    border-top-left-radius: 100% ;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
    display: inline-block;
    position: relative;


}

#top-right {
    width: 15em;
    height: 15em;
    background: gold;
    border-top-left-radius: 0 ;
    border-top-right-radius: 100%;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
    display: inline-block;
    position: relative;




}

#bottom-right {
    width: 15em;
    height: 15em;
    background: orangered;
    border-top-left-radius: 0 ;
    border-top-right-radius: 0;
    border-bottom-right-radius: 100%;
    border-bottom-left-radius: 0;
    display: inline-block;
    position: relative;


}

#bottom-left {
    width: 15em;
    height: 15em;
    background: darkgreen;
    border-top-left-radius: 0 ;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 100%;
    display: inline-block;
    position: relative;

}

＆＃13;

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <link rel="stylesheet" type="text/css" href="style.css">
    <script src="jscode.js"></script>
    <title>title</title>
</head>
<body>

<div id = "title">Title</div>
<div class = "container">
    <div id = "top-left"></div>
    <div id= "top-right"></div>
    <div id = "bottom-left"></div>
    <div id = "bottom-right"></div>

</div>


</body>
</html>

＆＃13;

在小提琴（http://jsfiddle.net/interestinall/hgo7h5v4/）上，剧本没有做任何事情。在WebStorm上，它会引发以下错误：ReferenceError：document not defined。

所以我的问题是：如何定义文档？

任何帮助将不胜感激！

Answer 1

如何定义文档？

一般来说。你没有。

在浏览器中运行的JavaScript，在网页中将有一个由环境提供的document对象。

WebStorm是一个用于Node.JS的IDE，您似乎正在使用它的Node.js结尾来获取您的＆＃34;文档未定义＆＃34;结果。有一些DOM的实现可以在那里为你提供这样的对象，但你的代码显然是试图在网页中运行，所以这不是你应该向下看的路线。

您的问题是您正在设置前景 color，并且您没有任何文字可以更改颜色。您应该改为查看backgroundColor属性。

Answer 2

您的代码没问题，但您设置color而不是backgroundColor。

document.getElementById("top-left").style.backgroundColor = "blue";

color属性用于显示在元素中的文本。

您不必（也不能，无论如何）使用您自己的代码定义document对象。它是Web浏览器基础结构向您显示的对象。

如何在javascript中定义文档？ WebStorm

2 个答案: