logo标签列表

使用JavaScript更改颜色

javascript
9

我是一名初学者，正在学习JavaScript。我尝试使用JavaScript将文本颜色更改为红色，但是它并没有起作用。请问我的代码有什么错误？

<!DOCTYPE html>
<html>
<head>
<script>
function display()
{
var col=document.getElementById("demo").innerHTML;
col.style.color="red";
}
</script>
</head>
<body>

<h1>My First JavaScript</h1>
<p id="demo">click on the button bellow.....</p>

<button onclick="display()">Display</button>

</body>
</html>
5个回答
14

将document.getElementById("demo").innerHTML;中的innerHTML移除。

<!DOCTYPE html>
<html>
<head>
<script>
function display()
{
var col=document.getElementById("demo");
col.style.color="#FF0000";
}
</script>
</head>
<body>

<h1>My First JavaScript</h1>
<p id="demo">click on the button below.....</p>

<button onclick="display()">Display</button>

</body>
</html>
7
不要使用innerHTML，它会返回一个字符串。
可以在对象本身上使用样式。
查看它的工作原理：JsFiddle。
function display() { var col = document.getElementById("demo"); col.style.color = "red"; } - vrunoa
3
你可以尝试这个……
document.getElementById('demo').style.color = '#FF0000';
1

替换这段代码：

function display()
{
var col=document.getElementById("demo").innerHTML;
col.style.color="red";
}

使用此代码：
function display()
{
var col=document.getElementById("demo");
col.style.color="red";
}

内部HTML将包含演示标签内的HTML，但您需要引用标签本身。
0

<!DOCTYPE html>
<html>
<head>
<script>
function display()
{
document.getElementById("demo").style.color="red";
}
</script>
</head>
<body>

<h1>Your Fixed JavaScript</h1>
<p id="demo">click on the button bellow.....</p>

<button onclick="display()">Display</button>

</body>
</html>

这是我刚刚修复的版本，我改变了文字颜色使其变成红色，因为之前它没有变化。

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接