webkit添加额外的<a> tags in <li></li></a>

时间:2012-06-03 17:09:07

标签: google-chrome safari webkit

我的代码段如下:

<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<title>Test</title>
<style>
</style>
</head>

<body>
<div>
    <div>
        <ul>
            <li><a href="home.html">Home<a></li>
            <li><a href="photos.html">Photos</a></li><li><a href="videos.html">Videos</a></li>      
        </ul>
    </div>

</div>
</body>

</html>

基于webkit的浏览器将这些显示为

<div>
    <div>
        <ul>
            <li><a href="home.html">Home<a><a></a></li>
            <li><a></a><a href="photos.html">Photos</a></li><li><a href="videos.html">Videos</a></li>       
        </ul>
    </div>

</div>

注意额外的空锚标签。我有一些javascript逻辑迭代这些li标签并修复锚点,但现在由于虚假的锚标签而进行折腾。有解决方案吗?

2 个答案:

答案 0 :(得分:1)

<li><a href="home.html">Home<a></li>

不应该是

<li><a href="home.html">Home</a></li>

答案 1 :(得分:1)

看起来你可能只是输错了。在这段代码中:

    <div>
      <ul>
        <li><a href="home.html">Home<a></li>
        <li><a href="photos.html">Photos</a></li><li><a href="videos.html">Videos</a></li>      
      </ul>
    </div>

看起来需要关闭<a>中的最后一个<a href="home.html">Home<a>标记。因此,当Webkit遇到最后<a>时,它会打开并为您关闭它。

尝试一下:

    <div>
      <ul>
        <li><a href="home.html">Home</a></li>
        <li><a href="photos.html">Photos</a></li>
        <li><a href="videos.html">Videos</a></li>      
      </ul>
    </div>