在加载时使用 javascript 添加样式属性答案

【问题标题】：Add style attribute using javascript on load在加载时使用 javascript 添加样式属性
【发布时间】：2025-12-04 00:50:02
【问题描述】：

我正在尝试在网站加载后立即使用 JavaScript 添加内联样式（由于某些原因，不能直接使用 CSS）。我希望表格中的所有文本都水平居中，

这是我目前的 JavaScript 代码：

window.onload = center_content();
function center_content (){
    var all_td = document.getElementsByTagName('table');
    all_td[0].style.textAlign = "center !important";
}

编辑：到目前为止已更正代码

jsfiddle: http://jsfiddle.net/GinSan/h46mz6na/4/（记住这种情况下我不能直接使用CSS）

非常感谢任何帮助。请不要使用 jQuery 解决方案。

【问题讨论】：

all_td[0].style.text-align = "center !important"; 被解释为all_td[0].style.text - align = "center !important";，即它试图从all_td[0].style.text 中减去align。然后您尝试为该值分配一个值，这对引擎没有意义。

标签： javascript html css

【解决方案1】：

在涉及 JavaScript 时，应在 camelCase 中使用连字符分隔的 properties of style object。

尝试这样使用：

document.getElementsByTagName('table')[0].style.textAlign = "center";

您也可以使用.style["text-align"] 来获得相同的结果。

但是如果你想设置优先级（即!important关键字），不只是值，你可以使用.setProperty()方法如下：

EXAMPLE HERE

document.getElementsByTagName('table')[0].style.setProperty("text-align", "center", "important");

还有一件事，通过在window.onload = center_content(); 处使用()，您将立即执行center_content() 并将返回的值undefined 分配给window.onload。

您可以像 window.onload = center_content; 一样执行此操作，也可以使用匿名函数：

window.onload = function () { /* ... */ };

【讨论】：

“当涉及到 JavaScript 时，应该在 camelCase 中使用连字符分隔的属性。” 但请注意，这只适用于 element.style 对象的属性。另见developer.mozilla.org/en-US/docs/Web/CSS/…
@FelixKling 当然！我的意思是样式属性。我只是忘了提。无论如何，谢谢。
谢谢，firefox 不再显示错误信息了。但是，文字仍然没有出现居中°v°可能还有其他错误，我添加了一个小提琴
@Gin-San 你的小提琴给了我一个 404 错误。我加了我的。请检查更新。
抱歉，不知道为什么链接失效了。试过你的例子，但由于某种原因，它不起作用，不知道为什么：/我添加了一个功能小提琴链接，你能看一下吗？

【解决方案2】：

您不能在变量名或属性中使用-。而是使用style.textAlign

【讨论】：

您可以在属性（名称）中使用-。您只是不能使用点符号来访问该属性。