logo标签列表

XHTML Strict 1.0 - target="_blank" 是否无效？

htmlvalidationtargetw3cxhtml-1.0-strict
29

我刚刚使用W3C验证器服务验证了我的实际XHTML Strict 1.0文档..它显示:

<ul id="socialnetwork">
            <li><a href="http://www.twitter.com" target="_blank"></a></li>
            <li><a href="http://www.flickr.com" target="_blank"></a></li>
            <li><a href="http://www.xing.com" target="_blank"></a></li>
            <li><a href="http://www.rss.com" target="_blank"></a></li>
</ul>

使用 target="_blank" 并不是一个有效的方式，但我需要在新标签页中打开链接，这样用户就不会离开当前页面。

我该怎么做？为什么这样做无效？

在 ul 中的 li 中的链接已经不再使用了。为什么不使用带有一堆 a 的 nav 呢？ - theking2
8个回答
18

你可能想查看W3常见问题解答：http://www.w3.org/MarkUp/2004/xhtml-faq#target

为什么在XHTML 1.1中移除了target属性？

实际上并没有。XHTML 1.0有三个版本：strict、transitional和frameset。这三个版本都尽可能地接近HTML 4.01，只不过是用XML重新编写。XHTML 1.1是XHTML 1.0 strict的更新版本，而且HTML strict从来没有包含target属性。另外两个版本（transitional和frameset）未被更新，因为没有需要更新的东西。如果您想使用target属性，请使用XHTML 1.0 transitional。

好的，那我必须放弃Strict..现在是过渡时期了。 - Tomkay
5
在这种情况下，如何在没有目标属性和JavaScript的情况下在新选项卡中打开链接？ - user1886419
请不要试图删除那些有用的好答案。即使您已经完成了SO，它们仍然对其他人有益。 - user743382
9
你应该问自己的问题不是如何“规避”Strict的限制，而是为什么你首先要使用XHTML Strict 1.0?
在你的情况下，我会简单地使用Transitional作为DTD。除非你正在开发针对特定操作系统的应用程序，例如在车载系统、物联网或更奇特的设备中不允许打开多个窗口的情况。这也是HTML Strict中缺少target属性的原因，因为Strict有意限制。
但由于你似乎是为“正常”使用而开发，所以你的文档类型应该反映出来，你应该使用：
<!DOCTYPE html>

同样请参阅为什么在XHTML中移除了target，祝好！J

7

我建议不要添加目标属性。由于无障碍原因，它已被删除，而且当页面决定为我打开标签时，我不喜欢它。当然，如果您希望这样做，可以自由选择。我将向您展示Darin上面提到的JavaScript方法，该方法允许您验证为XHTML 1.0 Strict或XHTML 1.1：

HTML代码：

<!-- Added link titles for better testing purposes -->
<ul id="socialnetwork">
    <li><a href="http://www.twitter.com/" class="targetblank">Twitter</a></li>
    <li><a href="http://www.flickr.com/" class="targetblank">Flickr</a></li>
    <li><a href="http://www.xing.com/" class="targetblank">XING</a></li>
    <li><a href="http://www.rss.com/" class="targetblank">RSS</a></li>
</ul>

JavaScript 代码：
window.onload = function() {
    // Code if document.getElementByClassName() doesn't exist
    if (document.getElementsByClassName == undefined) {
        document.getElementsByClassName = function(className) {
            var hasClassName = new RegExp("(?:^|\\s)" + className + "(?:$|\\s)");
            var allElements = document.getElementsByTagName("*");
            var results = [];

            var element;
            for (var i = 0; (element = allElements[i]) != null; i++) {
                var elementClass = element.className;
                if (elementClass && elementClass.indexOf(className) != -1 && hasClassName.test(elementClass))
                    results.push(element);
            }

            return results;
        }
    }

    var anchorList = document.getElementsByClassName('targetblank');
    for (var i in anchorList) {
        anchorList[i].target = '_blank';
    }
}

当然，如果你已经在其他地方包含了window.onload，你可以省略它，但我建议使用它（或使用另一个加载函数，例如JQuery的$(document).ready()），以便在页面完成加载时加载JavaScript。现在，你只需要给每个锚链接添加一个“targetblank”的类，链接就应该在新标签页中打开。
3

针对这种情况，我使用了一个简单的jQuery解决方案，它可以使用XHTML Strict进行验证，并允许在新窗口中打开。

<a href="http://www.example.com" class="linkExternal">Example URL</a>

<script type="text/javascript">
$(function(){
    $('a.linkExternal').on('click',function(e){
        e.preventDefault();
        window.open($(this).attr('href'));
    });
});
1
在XHTML STRICT中使用target的最佳方式是：onclick="target='_blank';" 
<a href="http://botje.tnhteam.com/" onclick="target='_blank';">Botje is overal</a>

例子： 点击底部的STRICT按钮

如果你需要_self或任何其他目标，你可以将_blank更改为_self，例如：onclick="target='_self';"

我希望这个答案对你们中的一些人有所帮助...

1
只是移除属性以通过静态验证并不能使其正确。 - Brad
是的，当属性被移除时它会进行验证，但他想要在新窗口或选项卡中打开URL，所以最好的选择是使用 onclick="target='_self';" 来使页面进行验证，这不会影响SEO，href 有一个有效的值。永远不要在 href 中使用 #，我认为这对SEO没有好处... - jagb
您使用了 XHTML 1.0 Strict，并且在 script pagespeed_no_defer="" 中使用了 pagespeed_no_defer，这在 XHTML 1.0 Strict 中是无效的。 - Kiquenet
1

虽然我无法说出为什么这个属性被认为是无效的，但如果您想让您的网站符合XHTML Strict标准，您可以使用JavaScript添加此属性作为解决方法。

0

试试这个：

<a href="#" onclick="window.open('urlgoeshere');">Link</a>
4
  1. 两个问题：1- href='#' 会跳转到页面顶部。2- 你破坏了SEO优化。
  2. 两个问题：1- 使用 href='#' 会使页面跳转到顶部。2- 你破坏了搜索引擎优化（SEO）。
 - Teoman shipahi
-1

我更喜欢这个

<a href="http://myurl.com" onclick="this.target='_blank'">Anchor text</a>
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接