如何在其中编写包含复杂内容的链接，以使其有效和正确

Question

w3 html验证器会告诉我这是错误的：

<a href="http://www.bla.com>
   <div>something</div>
   <ul>
       <li>first</li>
       <li>second</li>
   </ul>
</a>

为了获得HTML 4严格的验证（或只是为了正确地写东西）

写它的更好方法是什么：

1. 没有div和ul - 只需要设计我需要设计的类：

   <a href="http://www.bla.com>

     <span class="div">something</span>
      <span class="ul">
          <span class="li">first</span>
          <span class="li">second</span>
      </span>
   </a>
   

2. 没有<a>

<div id="actAsLink" onclick="javascript:window.open('http://www.bla.com')>

<div>something</div>

<ul>

   <li>first</li>
   <li>second</li>

</ul>

</div>

=========================

抱歉，代码看起来不是最好的 - 我在处理本网站上的“代码采样器”时遇到了麻烦。

Answer 1

我为选项1投票：锚点+描述性类名：

• 即使禁用了JavaScript或弹出式窗口，该链接仍然有效。 （这是我最强烈的重要功能。）
• 类属性描述了他们的角色，可以替代<ul>，<li>元素。可以使用CSS设置这些元素的样式。

你的结构看起来有点奇怪：你为什么要在锚中嵌套一个列表？

Answer 2

您应该在每个<a>，div和ul代码中都有li个代码：

<div><a href="#"></a></div>
<ul>
    <li><a href="#">first</a></li>
    <li><a href="#">second</a></li>
</ul>

这是有效的标记，但显然缺点是你有三个链接而不是一个。我不确定你为什么要在链接中有一个列表 - 更常见的是看到一个链接列表。