符合Web标准的超链接

上门开户

上门开户

2016-02-19 14:32

只要你有一台电脑或者手机,都能关注图老师为大家精心推荐的符合Web标准的超链接,手机电脑控们准备好了吗?一起看过来吧!
在HTML 4.0 Strict和XHTML 1.0 STRICT里不允许在a标签里使用target属性,这是一件令网页设计者懊恼的事.在过渡的规范里还是允许使用的.但通过一定的方法,我们可以解决这一问题.
  
  HTMl4.0规范里拿掉了target属性.但它添加了另外一个属性:rel.这个属性是用来指定包含链接的文档和所链接文档之间的关系的.规范里定义了其属性值(如:next,previous,chapter,section),在这些属性里大多数是用来定义一个大文档里各个小部分之间的关系的.事实上.规范里允许开发人员自由的使用非标准属性值做特定的运用.
  
  在这里,我们采用一个自定义值external用于rel属性来标记一个链接,用来新开一个窗口.
  
  不符合最新Web标准的链接代码:
  a href="document.html" target="_blank"external link/a
  
  运用rel属性:
  a href="document.html" rel="external"external link/a
  
  现在我们构建了一个符合Web标准的新开窗口的链接,我们还需要运用JavaScript是其实现新开窗口.脚本要实现的工作是当网页加载时,找到文档里的所有那些我们定义为rel="external"的超链接.
  
  首先我们要判断浏览器.
  if (!document.getElementsByTagName) return;
  
  getElementsByTagName是DOM1标准里一个容易使用的方法,且它被现在的大多数浏览器所支持,因为一些旧的浏览器如Netscape 4和IE4不支持DOM1,所以我们必须通过判定这一方法是否存在来排除这些旧版本的浏览器.
  
  下一步,我们通过getElementsByTagName方法取得文档里所有的a标签:
  var anchors = document.getElementsByTagName("a");
  
  anchors被赋值为包含各个a标签的数组,现在我们必须遍历各个a标签并且修改它:
  for (var i=0; i anchors.length; i++) {
  var anchor = anchors;
  找到要实现新开窗口的a标签
  if (anchor.getAttribute("href") &&
  anchor.getAttribute("rel") == "external")
  
  接下来.建立属性值target并赋值"_target":
  anchor.target = "_blank";
  
  
  完整的代码:
  ------------------------
  
  function externalLinks() {
  if (!document.getElementsByTagName) return;
  var anchors = document.getElementsByTagName("a");
  for (var i=0; ianchors.length; i++) {
  var anchor = anchors;
  if (anchor.getAttribute("href") &&
  anchor.getAttribute("rel") == "external")
  anchor.target = "_blank";
  }
  }
  window.onload = externalLinks;

展开更多 50%)
分享

猜你喜欢

符合Web标准的超链接

Web开发
符合Web标准的超链接

什么是符合web标准的网站

Web开发
什么是符合web标准的网站

s8lol主宰符文怎么配

英雄联盟 网络游戏
s8lol主宰符文怎么配

论web标准的网页制作和符合web标准的网站UI

Web开发
论web标准的网页制作和符合web标准的网站UI

符合web标准的嵌入Flash的方法

Web开发
符合web标准的嵌入Flash的方法

lol偷钱流符文搭配推荐

英雄联盟 网络游戏
lol偷钱流符文搭配推荐

符合WEB标准的网页图像的代码精简

Web开发
符合WEB标准的网页图像的代码精简

符合Web标准!CSS同比例缩小图片

Web开发
符合Web标准!CSS同比例缩小图片

lolAD刺客新符文搭配推荐

英雄联盟
lolAD刺客新符文搭配推荐

朝着 零缺陷 的方向

朝着 零缺陷 的方向

网页设计中META标签写法的常见错误及后果

网页设计中META标签写法的常见错误及后果
下拉加载更多内容 ↓