jQuery在IE8中添加自闭DIV标签

Question

下面的代码根据表单上已有的数据设置了一个编辑界面，效果很好。除了根据this msdn article，任何自封闭的标签（例如：<div />）都没有innerhtml 属性。这使得我的个人 jscript 日历库阻塞了对正在创建的 div 的 innerHTML 分配。

fields.find("p[item][type='Calendar']").each(function() {
            index++;
            var currentText = $(this).html();
            $(this).html("<input id=\"calInput" + index + "\" type=\"text\" value=\"" + currentText + "\" /><div id=\"cal" + index + "\"></div>");
            myFactory.newCalendar("cal" + index, "calInput" + index);
        });

如何强制 jQuery 使用我在下面概述的 html 而不是创建自封闭 div？

编辑：从上面得到的html代码是：

<div id="cal2" style="" class="jcalStyle hide"/>

我需要它：

<div id="cal2" style="" class="jcalStyle hide"></div>

编辑 2：

Firefox 正在正确生成 HTML。我不知道为什么 IE8 会自动关闭（无效？） div。

Answer 1

这篇文章并不是说自闭标签没有innerHTML。这是说具有 empty 内容模型的标签（void elements，在规范中，如 img）没有它。

还要注意，在 HTML 中，div 不能写成 <div/> (reference)。它必须写成<div></div>。很多很多工具（例如 jQuery）让您可以快速轻松地使用规则，但别担心，jQuery 实际上并没有 添加 那个标签到您的页面标记（它是添加元素到 DOM，这完全是另一回事）。 <element/> 语法仅允许用于 void 元素（如 img）和外来元素（如 SVG 内容）。