仓酷云

 找回密码
 立即注册
搜索
热搜: 活动 交友 discuz
查看: 1772|回复: 8
打印 上一主题 下一主题

[DIV+CSS] DIV教程之切合Web尺度的超链接

[复制链接]
透明 该用户已被删除
跳转到指定楼层
楼主
发表于 2015-1-16 00:18:54 | 显示全部楼层 回帖奖励 |倒序浏览 |阅读模式

马上注册,结交更多好友,享用更多功能,让你轻松玩转社区。

您需要 登录 才可以下载或查看,没有帐号?立即注册

x
层叠样式表(CascadingStyleSheets)的缩写,用于定义HTML元素的显示形式,是W3C推出的格式化网页内容的标准技术。网页设计者必须掌握的技术之一。
 在HTML4.0Strict和XHTML1.0STRICT里不同意在<a>标签里利用target属性,这是一件令网页计划者烦恼的事.在过渡的标准里仍是同意利用的.但经由过程必定的办法,我们能够办理这一成绩.
  
  HTMl4.0标准里拿失落了target属性.但它增加了别的一个属性:rel.这个属性是用来指定包括链接的文档和所链接文档之间的干系的.标准里界说了其属性值(如:next,previous,chapter,section),在这些属性里年夜多半是用来界说一个年夜文档里各个小部分之间的干系的.现实上.标准里同意开辟职员自在的利用非尺度属性值做特定的使用.
  
  在这里,我们接纳一个自界说值external用于rel属性来标志一个链接,用来新开一个窗口.
  
  不切合最新Web尺度的链接代码:
  <ahref="document.html"target="_blank">externallink</a>
  
  使用rel属性:
  <ahref="document.html"rel="external">externallink</a>
  
  如今我们构建了一个切合Web尺度的新开窗口的链接,我们还必要使用JavaScript是实在现新开窗口.剧本要完成的事情是当网页加载时,找到文档里的一切那些我们界说为rel="external"的超链接.
  
  起首我们要判别扫瞄器.
  if(!document.getElementsByTagName)return;
  
  getElementsByTagName是DOM1尺度里一个简单利用的办法,且它被如今的年夜多半扫瞄器所撑持,由于一些旧的扫瞄器如Netscape4和IE4不撑持DOM1,以是我们必需经由过程判断这一办法是不是存在来扫除这些旧版本的扫瞄器.
  
  下一步,我们经由过程getElementsByTagName办法获得文档里一切的<a>标签:
  varanchors=document.getElementsByTagName("a");
  
  anchors被赋值为包括各个<a>标签的数组,如今我们必需遍历各个<a>标签而且修正它:
  for(vari=0;i<anchors.length;i++){
  varanchor=anchors;
  找到要完成新开窗口的<a>标签
  if(anchor.getAttribute("href")&&
  anchor.getAttribute("rel")=="external")
  
  接上去.创建属性值target并赋值"_target":
  anchor.target="_blank";
  
  
  完全的代码:
  ------------------------
  
  functionexternalLinks(){
  if(!document.getElementsByTagName)return;
  varanchors=document.getElementsByTagName("a");
  for(vari=0;i<anchors.length;i++){
  varanchor=anchors;
  if(anchor.getAttribute("href")&&
  anchor.getAttribute("rel")=="external")
  anchor.target="_blank";
  }
  }
  window.onload=externalLinks;
</p>
不管你用什么工具软件制作网页,都有在有意无意地使用CSS。用好CSS能使你的网页更加简炼,同样内容的网页,有的人做出来有几十KB,而高手做出来只有十几KB。
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

QQ|Archiver|手机版|仓酷云 鄂ICP备14007578号-2

GMT+8, 2024-5-25 21:49

Powered by Discuz! X3.2

© 2001-2013 Comsenz Inc.

快速回复 返回顶部 返回列表