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

Why can’t I change the styles of my HTML element using JavaScript?

本文关键字：HTML 元素 样式 更改 JavaScript 不能 为什么      更新时间：2023-09-26

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

  • 网页代码： https://i.stack.imgur.com/7qlZx.png
  • Javascript代码：https://i.stack.imgur.com/DYvuq.png

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

我不知道

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

在你的原始代码中，你错误地将 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';

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

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

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

x.style.fontSize = '20px';

如果您在 Chrome 中尝试原始代码，并且 JavaScript 控制台可见（查看>开发者> JavaScript 控制台），则在尝试运行原始代码时应该会看到错误。

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

您错误地引用了样式。您必须将其称为 x.style.fontSize = '20px' .取而代之的是，您最近选择了x.style.fontSize('20px').希望这有帮助！

相关文章：