本文参考了以下文章:

  • Kevin Yank的《New-Window links in a Standards-Compliant World》
  • 《Standards-based Replacement for target="_blank" in External links》

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

"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="externa l"属性。原来这样写的代码:

<a href="document.html" target="_blank"> 打开一个新窗口</a>

现在要写成这样:

<a href="document.html" rel="external">打开一个新窗口</a>

这是符合strict标准的方法。当然还必须配合一个javascript才有效。

javascript

完整的代码JS如下:

function externallinks() {if (!document.getElementsByTagName) return;var anchors = document.getElementsByTagName("a");for (var i=0; i<anchors.length; i++) {var anchor = anchors[i];if (anchor.getAttribute("href") &&anchor.getAttribute("rel") == "external")anchor.target = "_blank";}}window.onload = externallinks;

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

<script type="text/javascript" src="external.js"></script>

就是这样。

最后补充一句,我网站采用的target="new"在过渡型DOCTYPE下是允许的,但也不符合strict标准。下次改版时我将采用strict模式,将所有target="new"改成rel="external"。

转载于:https://www.cnblogs.com/Hi-Ksir/archive/2008/07/31/1256971.html

_blank开新窗口不符合标准?相关推荐

  1. JavaScript-打开新窗口(window.open)

    1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 < ...

  2. vue,下载导出文件,开新窗口导出

    vue,下载导出文件,开新窗口导出 封装 设置url参数方法 //设置url参数 //setUrlPrmt({'a':1,'b':2}) //显示 a=1&b=2 setUrlPrmt(obj ...

  3. 符合w3c 的 strict标准,用 rel 替换_blank打开新窗口

    现在一般网站打开新窗口采用的是target="_blank",这在过渡型DOCTYPE(xh tml1-transitional. dtd)下是允许的,但也不符合W3C的stric ...

  4. html中open打开新网页,JavaScript-打开新窗口(window.open)

    window.open function Wopen(){ window.open('http://www.imooc.com','_blank','width=600,height=400,top= ...

  5. JS-打开新窗口(window.open)/关闭窗口(window.close)

    打开新窗口(window.open) open() 方法可以查找一个已经存在或者新建的浏览器窗口. 语法: window.open([URL], [窗口名称], [参数字符串]) 参考说明: URL: ...

  6. WebBrowser响应页面中的blank开新窗口及window.close关闭本窗体

    注:本文适用.net 2.0+的winform项目 目的: 点击页面中的target="_blank"链接时,弹出新窗体 页面中有window.close()操作时,关闭窗体 上述 ...

  7. vue 点击打开新窗口

    <div @click="openNew" /> methods: { openNew() {const routes = this.$router.resolve({ ...

  8. IE不能开新窗口的解决方法

    以前贴了很多办法,但是好像并不是都能解决,因为造成这种情况的原因有好多这里简单总结了一下 1.很多情况下都是因为安装了广捷居制作的ACDSEE32 5.0迷你中文版所致,也有人是安装过一个IE下载增强 ...

  9. vue 按钮点击打开新页面_Vue中在新窗口打开页面及Vue-router的使用

    背景 在开发提分加项目的过程中,遇到了点击下拉菜单时在新窗口中打开页面,由于之前一直做的是单页面应用,没有碰到过类似的需求,于是上网搜了一下解决办法,也再次系统地温习了一下vue-router. 解决 ...

最新文章

  1. SAP 电商云 Spartacus UI B2B checkout 点击 Continue 不能跳转到下一页面
  2. 10年老电脑如何提速_中国电信宣布将对宽带免费提速,最高500Mbps
  3. vs中四点画矩形的算法_中考热点,初高中衔接之倒角利器四点共圆
  4. 软件测试工程师面试必备技能
  5. Java 六种异常处理的陋习
  6. DPDK AF_XDP
  7. ArcGIS10.2的详细安装过程和下载方法
  8. 网易邮箱登录php,PHP模拟登陆163邮箱发邮件及获取通讯录列表的方法
  9. 服务器系统事件id1001,win10系统玩游戏出现蓝屏事件ID1001的解决方法
  10. 浏览器的窗口大小被改变时触发的事件window.onresize
  11. springcloud4-服务熔断hystrix及sentinel
  12. python qq自动发消息软件_Python之qq自动发消息的示例代码
  13. android的前景
  14. (DES)Single-Shot Object Detection with Enriched Semantics
  15. 智力题--CSDN论坛收集
  16. 11. Container With Most Wate
  17. System.Security.SecurityException: 未找到源,但未能搜索某些或全部事件日志。不可 访问的日志: Security
  18. 极智Paper | YOLOv7 更高 更快 更强
  19. PowerShell 学习笔记 - 1 PS Core 基础
  20. vue前端服务器端口_Vue前后端不同端口实现方案

热门文章

  1. 升级思科WLC firmware详细步骤
  2. mysql5.7.18-winx64安装
  3. 使用 ssmtp 於 shell 透過 Gmail 寄信
  4. 手机付费未成规模 阅读市场付费意愿萎缩
  5. IE与FF的常见兼容问题及总结
  6. python中字符串(二)-访问值、更新、转义、运算
  7. js 导出pdf上传至oss_前端上传图片到oss,压缩图片后上传至oss(补充图片文件旋转90度问题)...
  8. 有哪些指标可以描述两个图(graph)的相似度?
  9. Ethernity Chain将发布棒球球星Fernando Tatis Jr.系列NFT
  10. 佳士得首次NFT竞拍已经开始,目前竞拍价为180万美元