Javascript 已创建复选框未正确关闭标记

Javascript created Checkbox does not close off tag properly

本文关键字：创建 复选框 Javascript      更新时间：2023-09-26

如果我创建一个这样的复选框，并将其添加到我的表格[TD]标签中：

var chkBx = document.createElement('input');
chkBx.type = 'checkbox';
td.appendChild(chkBx);

它将创建 

<tr>
    <td>
        <input type="checkbox" value="Current Issue">
    </td>
</tr>

此输入标记尚未正确关闭。这在我的代码中的其他地方导致了问题(例如悬停不起作用(。

我需要在我的 Javascript 中做些什么来正确关闭它吗？

这取决于您使用的 DOCTYPE。XHTML需要结束标签，HTML不需要。我认为浏览器会自动决定动态创建的元素是否需要结束标签，具体取决于 DOCTYPE。

jsfiddle 上的解析器似乎也存在问题。如果没有结束标记，它不起作用，尽管标记在 W3C 验证器上正确验证。

您的 CSS 选择器没有选择任何内容。

.Table .Popup tr:hover {
    background-color:red;
}

应该是：

.Popup tr:hover {
    background-color:red;
}

(见：http://jsfiddle.net/kUTDB/4/(

和

.Table .Popup .PopupRow:hover {
    background-color:red;
}

应该是

table tr.PopupRow:hover {
    background-color:red;
}

或

table .PopupRow:hover {
    background-color:red;
}

(见：http://jsfiddle.net/kUTDB/5/(

请注意，它们都将选择相同的元素，因此具有更具体的选择器(第二个(将是实际使用的元素。

您的第一个选择器.Table .Popup tr:hover将匹配当前悬停在上面的tr元素，这些元素是具有一类Popup的任何元素的后代，而这些元素又是具有一类Table的任何元素的后代。

您的第二个选择器.Table .Popup .PopupRow:hover将匹配当前悬停在某类PopupRow的任何元素，这些元素是具有一类Popup的任何元素的后代，而又是具有Table类的任何元素的后代。

小提琴中的标记不反映该结构，因此选择器不匹配任何内容(这就是您的样式未反映的原因(。

相关文章：