您的位置：首页 > Web前端 > HTML

HTML Parsing Error: Unable to modify the parent container element before the child element is closed

2015-10-12 19:34 656 查看

在IE8浏览器下调试JS时, 碰到了这个错误, 最终发现原因是缺少div的结束标签</div>. 转载的这篇文章虽没能解决我的问题, 但我觉得写得挺好, 转载在此, 以便日后碰到类似问题作为参考.

原本地址: /article/4776897.html

感谢原作者.

==========================以下为转载内容==========================

日前，在进行JS测试的时候，不巧碰到了IE8下的KB927917的错误。在网络上搜寻了一番之后，结合实际，给出了自己的解决方案。下面用示例来说明。

先看看下面的示例一的网页代码：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
　　<title>KB927917</title>
</head>
<body>
　　<div id="GrandFather">
　　　　<div id="Uncle">This is Uncle</div>
　　　　<div id="Father">
　　　　　　<script　 type="text/javascript"　>
　　　　　　　　function $(Id){return document.getElementById(Id);}
　　　　　　　　document.write('<div id="Nephew">This is Nephew</div>');
　　　　　　　　$('GrandFather').appendChild($('Nephew'));
　　　　　　</script>　
　　　　</div>
　　</div>
</body>
</html>

这段示例代码很简单，在id为Father的div中，用JS生成一个id为Nephew的div，并将该div添加为id为GrandFather的div的子元素。

然而，这段代码在IE8下浏览，浏览器报了KB927917的错误。该错误所示如下：

HTML Parsing Error: Unable to modify the parent container element before the child element is closed (KB927917)

我对该段英文的理解是：在子元素闭合之前不能对其父容器元素进行修改

上面的示例代码，JS的代码是放在id为Father的div中，在执行JS代码时，该div还没有闭合。此时JS试图添加子元素到其父容器（id为GrandFather的div）时，就引发了KB927917的错误。

虽然上面的代码在IE8下会报KB927917的错误，但是渲染还是正常的。然而，笔者在测试其他网页的时候，由于该错误，导致页面的按钮失效。因此，还是要想办法解决该问题。

网上提到该错误的时候，几乎都是提到一种解决方案，将JS代码移到Body标签的后面。经过笔者的实验，发现将JS代码移到id为GrandFather的div外面就可以了。也就是JS代码的执行不影响div的闭合就可以了。

下面是示例二的网页代码

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
　　<title>KB927917</title>
</head>
<body>
　　<div id="GrandFather">
　　　　<div id="Uncle">This is Uncle</div>
　　　　<div id="Father">
　　　 </div>
　　</div>
　　<script type="text/javascript"　>
　　　　function $(Id){return document.getElementById(Id);}
　　　　document.write('<div id="Nephew">This is Nephew</div>');
　　　　$('GrandFather').appendChild($('Nephew'));
　　</script>　
</body>
</html>

上面的示例代码就解决了IE8下的KB927917的错误。而没必要将JS代码放置在Body的标签后面。

再回看示例一的代码。在JS代码执行的时候，id为Father的div没有闭合，而其父容器id为GrandFather的div此时也没有闭合。我突然想到，是不是id为GrandFather的div没有闭合才是引发KB927917错误的主要原因。为此，做了一个实验，修改了一下代码，将原本“添加为id为GrandFather的div的子元素”改成“添加为id为Uncle的div的子元素”。因为在执行这段JS的代码时，id为GrandFather的div没有闭合，而id为Uncle的div已经闭合。

下面是示例三的网页代码：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
　　<title>KB927917</title>
</head>
<body>
　　<div id="GrandFather">
　　　　<div id="Uncle">This is Uncle</div>
　　　　<div id="Father">
　　　　　　<script　 type="text/javascript"　>
　　　　　　　　function $(Id){return document.getElementById(Id);}
　　　　　　　　document.write('<div id="Nephew">This is Nephew</div>');
　　　　　　　　$('Uncle').appendChild($('Nephew'));
　　　　　</script>　
　　　　</div>
　　</div>
</body>
</html>

测试这段代码，一切正常。这也印证我之前的判断——id为GrandFather的div没有闭合才是引发KB927917错误的主要原因

经过上面的测试，可以总结为，当JS试图修改一个没有闭合的元素的时候，会引发KB927917的错误。

最后说两句题外话，同样的示例一的网页在IE9下浏览正常，似乎IE9自动修正该错误。网上说，该错误在IE7和IE6会引发长时间的读取动作，就像死机了一样，我没有测试，不好评说。另，在VS2008中直接启动用IE8浏览，该错误也似乎被修正，这是什么原因，也就没有深究了。

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航