为什么我不能使用JavaScript更改HTML元素的样式？

Question

我遇到了问题，我制作了这个测试代码来向您展示我的问题。

• HTML code：http://i.stack.imgur.com/7qlZx.png
• Javascript代码：http://i.stack.imgur.com/DYvuq.png

我想要做的是改变id的样式。但由于某种原因，它不起作用。

我不知道发生了什么，我真的需要你的帮助。感谢。

Answer 1

从您发布的代码图片来看（http://jsfiddle.net对于这类事情来说是更好的选择），您的JavaScript是错误的。

x.style.fontSize('20px');

HTML元素上的style对象没有名为fontSize的函数，它有一个名为property的{​​{1}}。您可以为其指定所需的值，如下所示：

fontSize

如果您尝试使用原始代码，例如：可以看到带有JavaScript控制台的Chrome（查看＆gt;开发人员＆gt; JavaScript控制台），当您尝试运行原始代码时，您会看到错误。

Answer 2

在原始代码中，您错误地将JavaScript属性称为方法...

// ORIGINAL/INCORRECT CODE
// x.style.fontSize('20px');
// x.style.fontFamily('arial');
// x.style.color('#008080');
// x.style.border('10px solid #000');

...更正

// CORRECTED
// These are properties, NOT methods.
x.style.fontSize = '20px';
x.style.fontFamily = 'arial';
x.style.color = '#008080';
x.style.border = '10px solid #000';

Answer 3

这些样式属性是属性而不是方法。也就是说，它不应该是x.style.fontSize('20px')，而是x.style.fontSize = '20px'。