0

当我遇到一个奇怪的错误时,我正在修复 IE8 和 IE9 中的错误。HTML 中有一个<section class="create">标签,但在页面加载后,在页面下方稍远处有完全相同的标签。起初,我认为有一些糟糕的 javascript 克隆了section某种方式,但我禁用了 javascript,并且在页面加载后它仍然存在。这必须是创建此标签的 HTML 解析器,对吧?呈现的 HTML 与 HTML 文件完全不匹配。

我知道 HTML 解析器会添加</div>标签或</html>标签等,当它们丢失时,但是 IE 会因为某种原因重新打开添加标签吗?如果是这样,是什么原因造成的?如果不是这种情况,当禁用 javascript 时,什么可能导致 HTML 中不存在的标签被添加到 DOM 中?

我正在处理的 HTML 页面超过 20,000 行,而且肯定到处都是格式错误的 HTML,其中任何一个都可能导致 DOM 渲染不正确。如果有一个片段我可以添加到这个问题中会有所帮助,请在评论中告诉我。

这是复制此问题的最小 HTML。请注意,它只发生在form标签内,而不是div标签内。section表单元素关闭后,标签在 IE8 和 IE9 中重新打开,因此创建了 2 个元素section

<!DOCTYPE html>
<html>
    <head></head>
    <body>
        <form>
            <section class="create">
                CREATE SECTION
        </form>
    </body>
</html>

这是一个小提琴:http: //jsfiddle.net/VurE6/

作为记录,IE10、Chrome、Firefox 和 Safari 没有显示这种行为(据我所知)。

4

1 回答 1

3

在某种程度上,所有的浏览器都会做这种事情。例如,试试这个

<b>1<i class="create">2</b>3</i>

在任何浏览器中,您都应该看到两个 i 元素都使用“create”类创建。

关于何时发生这种情况的规则非常复杂,但是当关闭标签没有结束其元素后代的影响时,就会发生这种情况。在 IE9 中,表单结束标记不会关闭该部分,因此要保持该部分继续运行,浏览器必须创建第二个部分元素。

虽然这在 b 和 i 元素的情况下有一定的意义,但对于 section 没有意义,因此在任何实现 HTML5 解析算法的浏览器(如 IE10 和现代 Firefox 和 Chrome)中都不会发生这种情况,但确实如此,显然,在 IE9 中。

请参阅http://www.w3.org/html/wg/drafts/html/master/syntax.html#misnested-tags:-bi-/b-/i了解 HTML5 如何处理错误嵌套的 b 和 i 标签问题。

于 2013-03-15T00:58:21.113 回答