html的嵌套错误

学html的时候根本没有人讲过关于的嵌套的问题，我一直都是自由组合随便搭配，怎么方便怎么来，但是实际上html是有一些嵌套的规定的，具体我暂时并没有去深入了解，主要是我今天使用js的时候发现明明spen元素里面有p元素，就是无法获取到，具体代码如下：

<p id="er">
    <span id="ps">span</span>
    <span class="td"><i>sad</i>span</span>
    <span>span <p>sda</p></span>
</p>

p元素下面的span子元素里面包着一个p元素，当我们时候document.getElementById(‘er’).innerHTML;输出的时候，你会发现只会返回span元素，里面的p元素不见，然后打开浏览器开发模式，查看源代码，你会发现解析是这样的。

p元素并没有包裹到span里面的p，而是被穿膛破肚，还衍生了新的p元素，这就是所谓的嵌套错误了，你不能在span，i，等等这种类型的元素里面添加block元素。

而且p元里面也不能添加p元素，这是我目前了解到的一些关于嵌套的问题，后续我应该还会更新的，应该还会有其他的嵌套需要注意的地方。