html中<a>标签_top和_parent的区别
在html中，<a>标签有个target属性，而targe属性有四个值，分别是：_blank、_self、_top、_parent。前两个相信很好理解，第一个就是在新窗口中打开的意思，第二个时候默认的，就是在当前窗口打开，那下面来说下后两者的区别。
_top就是打开的页面占据了整个页面，_parent就是打开的页面只是在父页面中打开，现在可能有点不太好理解，这两个属性主要用于框架文件中，首先我先贴上我的html文件，如下，注：代码中红色的字体在最后有讲解：
main.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>
<frameset rows="20%,*">
<frame src="top.html" noresize="noresize" />
<frame src="bottom.html" name="bottom" noresize="noresize" />
</frameset>
</html>
top.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>
<body style="font-size:24px;font-weight:bold;">
Example of "_parent" and "_top"
</body>
</html>
bottom.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>
<frameset cols="20%,*">
<frame src="left.html" noresize="noresize" />
<frame src="right.html" noresize="noresize" />
</frameset>
</html>
left.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>
<body style="font-size:18px;font-weight:bold;">
I'm left in bottom!!
</body>
</html>
right.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>
<body>
<h2>这是_parent的演示</h2>
<a href="test1.html" target="_parent">test1</a>
<br />
<h2>这是_top的演示</h2>
<a href="test2.html" target="_top">test2</a>
<br />
<h2>这是名称的演示</h2>
<a href="test1.html" target="bottom">test1</a>
</body>
</html>
test1.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>
<body>
<h1>这是test1.html文件</h1>
<a href="bottom.html">返回</a>
</body>
</html>
test2.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>
<body>
<h1>这是test2.html文件</h1>
<a href="main.html">返回</a>
</body>
</html>
从上述代码中，可以看出架构为
main.html文件包含了top.html文件和bottom.html文件，而bottom.html文件又包含了left.html文件和right.html文件，对于left.html和right.html文件来说，他们的“_parent”就是bottom架构，他们的“_top”就是main架构。
在我的代码中，有两句是红色的字体，这是什么意思呢？其实这两句话和“_parent”的作用是一样的，也就是说，可以通过name来实现“_parent”的作用。
参考来源：http://blog.sina.com.cn/s/blog_698e6e270100m3a0.html
html中<a>标签_top和_parent的区别的更多相关文章
- python 全栈开发，Day45(html介绍和head标签,body标签中相关标签)
一.html介绍 1.web标准 web准备介绍: w3c:万维网联盟组织,用来制定web标准的机构(组织) web标准:制作网页遵循的规范 web准备规范的分类:结构标准.表现标准.行为标准. 结构 ...
- html body中的标签
HTML中的标签有两类 一.字体标签 字体标签包含:h1~h6.<font>.<u>.<b>.<strong><em>.<sup> ...
- html中a标签的常见用法
html中a标签的常见用法 一.总结 一句话总结: a.页面跳转 b.使用锚点定位 c.下载文件 二.html中<a>标签的用法 转自或参考:html中<a>标签的用法http ...
- python 全栈开发，Day45（html介绍和head标签，body标签中相关标签）
一.html介绍 1.web标准 web准备介绍: w3c:万维网联盟组织,用来指定web标准的机构(组织) web标准:制作网页遵循的规范 web准备规范的分类:结构标准.表现标准.行为标准. 结构 ...
- html中map标签和area标签的应用（总结）
html中map标签和area标签的应用(总结) 一.总结 一句话总结: html中map标签和area标签和组成图片地图,在前端优化中可以减少http请求 1.map标签的用途是什么? 图片地图:是 ...
- html - body标签中相关标签
body标签中相关标签 今日内容: 字体标签: h1~h6.<font>.<u>.<b>.<strong><em>.<sup> ...
- HTML中Meta标签中http-equiv属性小结
HTML中Meta标签中http-equiv的用法: <meta http-equiv="这里是参数" content="这里是参数值"> 1.Ex ...
- HTML中Meta标签中http-equiv属性
HTML中Meta标签中http-equiv的用法: <meta http-equiv="这里是参数" content="这里是参数值"> 1.Ex ...
- HTML中meta标签作用及属性总结
在前端开发中编写html静态网页模板时,head标签内总是会带上许多meta标签,大多数时候并不十分了解这些标签的具体作用,只是别人写了我们也写上吧! 今天小编特意查询了一下关于网页中meta标签的作 ...
随机推荐
- js 字符串，数组扩展
console.log(Array.prototype.sort)//ƒ substring() { [native code] } console.log(String.prototype.subs ...
- HDU 1907 John（博弈）
题目 参考了博客:http://blog.csdn.net/akof1314/article/details/4447709 //0 1 -2 //1 1 -1 //0 2 -1 //1 2 -1 / ...
- 使用IDM下载软件下载百度云网盘里的资源，以Chrome浏览器为例
1.下载安装最新版的Chrome浏览器,我是在腾讯软件下载中心下载的,使用普通下载,下载地址:https://dl.softmgr.qq.com/original/Browser/72.0.3626. ...
- mysql中文乱码归纳总结
今天使用sqlalchemy往mysql数据库里插入数据的时候,发生了错误,因为字段包含中文,所以报错.在问题解决之后做一个总结. mysql中文乱码包括几个方面.mysql服务器层面.mysql ...
- Windows Server 2008安装教程
系统简介 windows server 2008是迄今为止最灵活.最稳定的windows 操作系统.Windows server 2008 的安装过程是基于镜像文件的,主要版本:Windows Ser ...
- Golang之路
目录 Golang之路 Golang之路 Golang(一) - 开篇必须吹牛逼 Golang(二) - 第一个go程序和基本语法 Golang(三) - 函数 Golang(四) - 流程控制 Go ...
- Linxu基础入门
Linux命令大全:http://man.linuxde.net/ 创建目录 使用 mkdir 命令创建目录 mkdir $HOME/testFolder 切换目录 使用 cd 命令切换目录 cd $ ...
- 一个电商项目的Web服务化改造3：改进方案の规范和约定、单表、单一职责
最近一直在做一个电商项目,需要把原有单系统架构的项目,改造成基于服务的架构,SOA. 有点挑战,做完了,会有很大进步. 上一篇,我们描述了原有项目中的问题. 或者说是,本篇的基本 ...
- Industrial Nim
http://codeforces.com/contest/15/problem/C 题意: 现有n个采石场,第i个采石场有mi堆石子 各堆分别有xi,xi+1……,xi+m-1颗石子 两名选手使用最 ...
- Jquery书写ajax
根据API学习本章 Jquery书写ajax 使用ajax发送表单到servlet,发送时显示等待图片,servlet处理完返回信息,在页面显示返回信息,并且隐藏等待图片 <%@ page la ...