`

不符合web标准的target="_blank"标签

 
阅读更多

我们要在新窗口中打开链接传统的通常做法是在链接后面加target="_blank",我们采用过渡型的DOCTYPE(xhtml1-transitional. dtd)时没有问题,但是当我们使用严格的DOCTYPE(xhtml1-strict.dtd)时,这个方法将通不过W3C的校验,会出现如下错误提示:

 Example Source Code [www.52css.com]
"there is no attribute target for this element(in this HTML version)"


原来在HTML4.01/XHTML1.0/XHTML1.1严格DOCTYPE下,target="_blank"、target="_self"等等语法都是无效的,我们只能通过JavaScript来变通实现。

有朋友问为什么不允许使用target="_blank"?这个属性很方便啊。呵呵,不知道W3C的专家们是怎么想的,据我所知,主要是“易用性、友好性”的问题,因为老外觉得不经过用户同意,没有明确提示就打开一个新窗口是不礼貌的。先不管这个取消是否合理,我们来看看解决办法。

rel属性

HTML4.0增加了一个新属性:rel,这个属性用来说明链接和包含此链接页面的关系,以及链接打开的目标。rel有许多的属性值,比如next、previous,、chapter、section等等。我们要使用的就是rel="external"属性。原来这样写的代码:

<a href="document.html" target="_blank">打开一个新窗口</a> 
现在要写成这样:

<a href="document.html" rel="external">打开一个新窗口</a> 
这是符合strict标准的方法。当然还必须配合一个javascript才有效。

javascript
完整的代码JS如下:

Example Source Code [www.52css.com]
function externalLinks() { 
if (!document.getElementsByTagName) return; 
var anchors = document.getElementsByTagName("a"); 
for (var i=0; i var anchor = anchors[i]; 
if (anchor.getAttribute("href") && 
anchor.getAttribute("rel") == "external") 
anchor.target = "_blank";


window.onload = externalLinks; 


你可以把它保存成一个.js文件(比如external.js),然后通过外部联接方法调用:

Example Source Code [www.52css.com]
<script type="text/javascript" src="external.js"></script> 


最后补充,标签target="new"在过渡型DOCTYPE下是允许的,但也不符合strict标准。
将所有target="new"改成rel="external"则是完全符合标准的标签! 

本文参考了以下文章:Kevin Yank的《New-Window Links in a Standards-Compliant World》 
《Standards-based Replacement for target="_blank" in External Links》

<!--em336tj start-->
分享到:
评论

相关推荐

    w3c标准 html标准验证 xhtml标准验证 css标准验证

    在Web开发领域,遵循W3C标准对于创建高质量、可维护和跨浏览器兼容的网页至关重要。HTML、XHTML和CSS标准验证确保了网页代码的规范性,有助于提高用户体验和搜索引擎优化。以下是一些关于这些标准验证及常见错误解决...

    WEB开发技术思考题

    【WEB开发技术思考题】涉及了HTML的基本结构和元素,以及一些常见的网页设计技巧。以下是对这些知识点的详细解析: 1. **HTML元标签(Meta...了解并掌握这些知识,有助于开发者构建符合标准的、具有交互性的网页内容。

    用javascript来控制 链接的target 属性的代码

    不符合最新 Web 标准的链接代码为:&lt;a href="document.html" target="_blank"&gt;external link&lt;/a&gt; 运用 `rel` 属性:&lt;a href="document.html" rel="external"&gt;external link&lt;/a&gt; 现在,我们构建了一个符合 Web 标准...

    CSS设计符合Web标准的网页表单的几个技巧

    在网页设计中,创建符合Web标准的表单是至关重要的,因为它们不仅影响用户体验,还直接关乎网站的可用性和易用性。以下是一些使用CSS和HTML技巧来优化网页表单设计的关键点: 1. **表单文本输入的移动选择**: 当...

    _blank?-crx插件

    如果设置`target="_blank"`,链接将在新窗口或新标签页打开。 4. **光标样式**:光标是用户在网页上移动时看到的指针形状,可以用来传达用户交互的不同状态。这个插件通过改变光标样式,向用户传达了链接打开方式的...

    Web前端开发试题.docx

    &lt;p&gt;&lt;a href="home.html" target="_blank"&gt;home&lt;/a&gt; &lt;a href="content.html" target="_blank"&gt;content&lt;/a&gt;&lt;/p&gt; 解释:修改后的代码更加符合 XHTML 1.0 Strict 的标准,提高了代码的可读性和维护性。 4. 简述 ...

    实用HTML5代码片段

    image=__POSTER__.JPG&amp;file=__VIDEO__.MP4"/&gt; &lt;img src="__VIDEO__.JPG" width="640" height="360" alt="__TITLE__" title="No video playback capabilities, please download the video below"/&gt; ``` 该...

    HTML+CSS技能测试(带答案),DOC.pdf

    HTML 使用一系列预定义的标签来结构化文本、图像和其他媒体,使其成为可读的网页格式。...在实际工作中,开发者还需要熟悉响应式设计、动画、布局技术以及最新的Web标准,以便创建符合现代需求的网页。

    dl、dt、dd 标记来改造163邮箱的广告条

    通过这种方式,我们不仅保持了原有的布局和样式,还优化了代码结构,使其更加符合Web标准,有助于提高页面的可访问性和SEO性能。在实际开发中,我们应尽可能地使用语义化的HTML标签,以提升用户体验和网站的可维护性...

    HTML基本语言代码 

    虽然该标签并不符合现代HTML标准,但在某些情况下仍会被使用。其基本语法如下: ```html &lt;bgsound src="音乐文件地址" loop="循环次数"&gt; ``` ### 5. 链接:`&lt;a&gt;` 标签 `&lt;a&gt;` 标签用于创建超链接,连接到其他网页...

    网页设计标签总览.pdf

    不过,这个标签也被认为是不推荐使用的,因为它不符合现代的网页设计标准,且在多种浏览器中可能表现不一致。 链接标签`&lt;a&gt;`用于创建超链接,它有几个重要的属性,包括`href`用于指定链接目标的URL,`target`用于...

    Web前端技术试题[汇编].pdf

    6. 要在新窗口打开一个链接指向的网页需用到 `target="_blank"`。 知识点:HTML 链接、target 属性、新窗口打开。 7. 特殊符号?(版权符号)对应的源代码是 `&copy;`。 知识点:HTML 实体、特殊符号、版权符号。...

    HTML+CSS技能测试(带答案) (2).docx

    ` `标签用于简单地换行,而`&lt;b&gt;`标签用于创建粗体字,`&lt;a&gt;`标签的`href`属性加上`mailto:`前缀可以创建电子邮件链接,`&lt;bodybgcolor&gt;`设置页面背景色,`&lt;i&gt;`标签产生斜体效果,`target="_blank"`属性使链接在新...

    web大总结///。。。。

    Web技术是互联网内容构建和呈现的核心技术,它包括了多种不同的标准和协议。... ...HTML文档由一系列元素构成,...随着Web标准的不断发展,Web开发人员需要不断学习新的HTML标签和最佳实践,以构建符合现代Web标准的网页。

    xHTML与HTML标签的写法有哪些不同

    在xHTML 1.1及后续版本中,`target` 属性被禁止,因为它不符合XML的语法规则。如果希望链接在新窗口中打开,推荐使用 `rel="external"` 并配合JavaScript来实现。例如,`&lt;a href=...

    php课后习题及答案php

    - **知识点**: 使用 target 属性可以控制链接打开的方式,target="_blank" 表示在新窗口或新标签页中打开链接。 - **选项分析**: - A. herf=”_blank”:herf 错误,应该是 href。 - B. name=”_blank”:name ...

    html设计代码学习大全

    然而,这一标签并不符合现代Web标准,不推荐使用。 ### 23. 内联框架 `&lt;iframe&gt;` 用于在当前页面内嵌入另一个HTML文档,例如:`&lt;iframe src="目标网址" width="宽度" height="高度"&gt;&lt;/iframe&gt;`。 以上列举了HTML...

    符合W3C的漂浮广告代码.txt

    ### 符合W3C标准的漂浮广告代码解析 #### 一、W3C标准简介 W3C(World Wide Web Consortium)是国际万维网联盟,它制定了一系列的标准来确保Web技术的兼容性和互操作性。这些标准涵盖了HTML、CSS、XML等多个方面,...

Global site tag (gtag.js) - Google Analytics