为什么HTML段落在我的Chrome上表现如此奇怪？

发布时间：2020-12-14 18:57:47 所属栏目：资源来源：网络整理

导读：获取一个空 HTML,输入此内容,并在Google Chrome上查看其源代码： pdivnbsp;/divWHY?/p 如果你像我这样做,你会看到这个来源： htmlhead/headbodypnbsp;/pdivnbsp;/divWHY?p/p/body/html 以防万一,here’s a demo using jsbin.在那个链接,你看到这样： [repeat

获取一个空 HTML,输入此内容,并在Google Chrome上查看其源代码：

<p><div>&nbsp;</div>WHY?</p>

如果你像我这样做,你会看到这个来源：

<html>
<head></head><body><p>&nbsp;</p><div>&nbsp;</div>WHY?<p></p>
</body></html>

以防万一,here’s a demo using jsbin.在那个链接,你看到这样：

[repeating P]


WHY?
[repeating P]

我已经添加了this jQuery：

$("p").html("[repeating P]");

删除整个< div>从它,一切都恢复正常.在< div>中添加更多的东西时,这个奇怪的意外行为是一致的,它可以是< span>或者我猜这里有什么.如果HTML是否良好,则无关紧要.

有人知道为什么

解决方法

作为一个基本的解释,div意在成为布局的“框”.一个拿着别的东西的盒子然而,p元素是为了(惊喜)一段文本.

因为一个div(容器)被放置在一个p(内联元素)中,它(在技术上)是不正确的.谷歌浏览器(作为标准稍微痴迷的)浏览器,它尝试通过添加额外的元素,如图所示纠正错误的嵌套.

W3C在其网站上有一篇关于这些language specifications的文章(很长的篇幅),但是可能最好的办法是检查不一致之处,并且可能遇到的问题就是验证您的书面源代码.最简单的方法是使用W3C Validator.

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!