如何使CSS影響解釋CSS后生成的DOM元素？

Question

我有以下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元素？

Answer 1

您需要更改的td風格。

#myTable {
    table-layout: fixed;
}

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

Answer 2

您的代碼沒有錯。 您在桌子周圍放了一個邊框。 您可能希望在td上包含邊框樣式規則，以實現所需的結果。

#myTable {
    table-layout    : fixed;
    border          : 1px solid black;
    border-collapse : collapse; /* Add this */
}

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

Answer 3

您的CSS正確且正確地應用了。 如前所述，您正在為CSS文件中的表格要求邊框。

如何使CSS影響解釋CSS后生成的DOM元素？

問題描述

3 個解決方案

解決方案1
3 2015-01-09 21:07:43

解決方案2
1 已采納 2015-01-09 21:06:16

解決方案3
1 2015-01-09 21:09:50

如何使CSS影響解釋CSS后生成的DOM元素？

問題描述

3 個解決方案

解決方案1 3 2015-01-09 21:07:43

解決方案2 1 已采納 2015-01-09 21:06:16

解決方案3 1 2015-01-09 21:09:50

解決方案1
3 2015-01-09 21:07:43

解決方案2
1 已采納 2015-01-09 21:06:16

解決方案3
1 2015-01-09 21:09:50