问题描述

页面代码如下所示:

<a href="#1">
   <a href="#2"></a>
</a>

但是在浏览器里面却解析为

<a href="#1"></a>
<a href="#2"></a>

a标签里面无法嵌套a标签，虽然a标签是内联元素(inline element)，但是经测试，

<a href="#1">
  <div>test</div>
</a>

是可以正确解析的，也就是说a标签里面可以嵌套块级元素，却无法嵌套a标签。

解决方案

<a href="#1">
    <object>
        <a href="#2></a>
    </object>
</a>

在内层a标签加一层object标签嵌套，解决了a标签嵌套的问题了。这个办法在火狐和谷歌、IE9及以上是没问题的。但是IE8及以下就会有问题，因为IE8不支持object标签，它会将object解析成一个对象a标签的内容显示不出来。