javascript - 如何让 CSS 影响解释 CSS 后生成的 DOM 元素?

标签 javascript html css

我有以下 HTML 代码:

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <link rel="stylesheet" type="text/css" href="style.css" />
    <title></title>
</head>
<body>
    <table id="myTable">
    </table>
<script src="jquery-1.11.2.js"></script>
<script src="logic.js"></script>
</body>
</html>

还有这段 CSS 代码:

#myTable {
    table-layout: fixed;
    border: solid 1px;
}

如您所见,该文档有一个空表。该表的内容(行和列)由 JavaScript 代码生成,链接在文档末尾。

当我打开文档时,CSS 中描述的边框出现在表格周围,但不出现在生成的单元格之间。

假设这是因为 CSS 链接到文档的开头,在 <head> 中,而生成行和列的 JavaScript 代码在文档末尾运行。

我(认为)我理解这个问题的原因,但我不确定如何解决这个问题。如何使 CSS 应用于文档中稍后生成的 DOM 元素?

最佳答案

您需要更改td 样式。

#myTable {
    table-layout: fixed;
}

#myTable, #myTable td{
    border: solid 1px;
}

关于javascript - 如何让 CSS 影响解释 CSS 后生成的 DOM 元素?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27869196/

相关文章:

javascript - 当属性位于另一个对象中时如何将 _.groupBy js 用于组对象 - TypeScript

html - 使用 CSS 在视觉上将长字符串分成 block (但在复制时保留原始格式)

javascript - 如何将标签的innerHTML渲染为嵌套HTML

html - 如何使用 flexbox 使卡片响应?

css - 显示网格 <p> 行与网格 <div> 行

JavaScript 模式 : "copy" ClassA properties to ClassB

javascript - 多个特殊字符替换优化

javascript - 获取隐藏视频的高度和宽度

html - jQuery 可排序链接未加载

javascript - 添加和删​​除类似乎会导致 dom 中出现问题