javascript - 通过不更新的 JavaScript 设置 HTML 表头元素的宽度

Question

我有一个 HTML 表格，由于表格标题 ( <th> ) 会根据表格数据 ( <td> ) 的宽度自动设置自己的宽度，我正在尝试添加 10px到它设置的任何值。

Array.from(document.getElementsByTagName("th")).forEach(th => {
    th.style.width = `${parseInt(window.getComputedStyle(th).getPropertyValue("width").split("px")[0]) + 10}px`;
});

记录我的开始和结束宽度工作正常，一切正常(即:"14px" 到 "24px")，值确实设置，如 Chrome 开发工具中所示，但网页上的实际表格没有'吨更新。我尝试通过 Chrome 开发工具将值编辑为大数字，如 1000px和 100% ，但那什么也没做。我错过了什么吗？

注意:我在 Windows 上使用最新的 Electron，最新的(但我假设这是我的一般 HTML 代码的问题，与 Electron 的工作方式无关) .

Answer 1

您可以使用 CSS 样式在每个“th”中增加 10px，设置元素的填充。

<style>
th { padding: 0px 10px; }
</style>

---

如果您的表格设置为 100% 宽度，并且您增加了所有元素的宽度，则无论您使用多少像素来执行此操作，您都不会看到差异。