Question

Chrome正在改变我的HTML结构，似乎没有理由，删除第二级锚标记会生成预期的html并将其替换为div或任何其他标记也可以正常工作。 Fiddle

书面代码：

<ul>
  <li>
    <a href="/">
      Whatup
      <ul>
        <li>
          <a href="/test/">Yo</a>
        </li>
      </ul>
    </a>
  </li>
</ul>

解释代码：

<ul>
  <li>
    <a href="/">
      Whatup
    </a>
    <ul>
      <a href="/"></a>
      <li>
        <a href="/"></a>
        <a href="/test/">Yo</a>
      </li>
    </ul>
  </li>
</ul>

工作代码示例：

<ul>
  <li>
    <a href="/">
      Whatup
      <ul>
        <li>
          <div>Yo</div>
        </li>
      </ul>
    </a>
  </li>
</ul>

Answer 1

内部列表中有另一个a。这就是导致内部ul突破外部a的原因，因为您在另一个a内无法拥有a（否则，浏览器不会＃39;知道如何处理点击内部a）。

换句话说，Chrome不会导致您的HTML格式不正确 - 您的HTML开头时格式不正确。

Answer 2

您的HTML无效。您应该使用a validator。

来自the a element的规范：

内容模型：透明，但必须没有互动内容后代。

链接是交互式内容（人们应该点击它们来加载新页面。）

浏览器正在尝试从您的错误中恢复。

Chrome malforms li＆gt; a＆gt; ul＆gt; li>一个HTML

2 个答案: