Question

在 Javascript 中单击按钮时更改文本颜色

2017-01-29

7314

javascript

我重新开始学习 Javascript，在单击按钮时遇到更改文本颜色的问题。

许多其他问题都提到了更改按钮本身的颜色，而我的代码似乎没有错误。

<body>
<h1>My First Web Page</h1>
<p>Exciting stuff! This is my first web page.</p>
<button id= “color”>Change color!</button>
<script>
document.getElementById('color').onclick = changeColor; var currentColor = “red”;
function changeColor() { 
        if(currentColor == “red”){ 
    document.body.style.color = “green”;
    currentColor = “green”;
        } else {
        document.body.style.color = “red”;
        currentColor = “red”;
        } 
            return currentColor; 
    }
</script>
</body>

但是，行

document.getElementById('color').onclick = changeColor; var currentColor = “red”;

生成错误，提示它是非法令牌。最初，我以为问题与未将代码放入表单有关。教学视频的演示似乎运行良好，但我一直收到此错误。有人能提供想法出了什么问题吗？

Answer 1

您的代码运行正常，但您使用了 不正确 的语法。将 “ 更改为 " 引号。

此外，您无需在函数内使用 return 语句，该语句代表 onclick 事件处理程序。

<body>
<h1>My First Web Page</h1>
<p>Exciting stuff! This is my first web page.</p>
<button id= "color">Change color!</button>
<script>
document.getElementById('color').onclick = changeColor; 
var currentColor = "red";
function changeColor() { 
        if(currentColor == "red"){ 
           document.body.style.color = "green";
           currentColor = "green";
        } else {
           document.body.style.color = "red";
           currentColor = "red";
        } 
    }
</script>
</body>