只使用frame实现多个页面的跳转

今天主要实现在同一个页面中不使用js进行页面的跳转。首先将一个页面分为两部分,左边放置选则跳转的a标签,右边放需要跳转的内容。
右部分具体实现

<div class="right">
            <iframe src="a.html" name="a" frameborder="0"></iframe>
        </div>

定义一个窗口,用于展示跳转的页面。同时我们需要给这个窗口一个名字name="a"并给右边部分右浮动。
左部分具体实现
首先创建四个html页面,分别是主页面,a,b,c页面(写上一些内容比如我是a).
然后在主页面中写个父容器放置左边部分和右边部分。

 <div class="left">
            <nav>
                <ul>
                    <li><a href="a.html" target="a">点击加载a</a></li>
                    <li><a href="b.html" target="a">点击加载b</a></li>
                    <li><a href="c.html" target="a" >点击加载c</a></li>
                </ul>
            </nav>
        </div>

左半部分左浮动,加个背景色,定义占25%宽度,里面放三个a标签。分别跳转到各自的页面。target定义了页面打开时是在哪个页面中打开的。_blank为创建空新页面,但是我们想要在本页面的右半部分展示所以我们的目标target是本页面a。此时当我们点击左部分的链接时,就会先在本页面窗口中寻找 name="a"的窗口,如果还是找不到就会到同级的窗口中进行寻找直到浏览器窗口。
在这里插入图片描述

注意

窗口下可以嵌套窗口,窗口与窗口之间彼此独立;有相互联系,不能直接联系;可以间接联系。
窗口分类

1: 系统窗口
2: 应用程序窗口,每个程序都有窗口 例如;视频程序 开发者工具 浏览器 都有窗口;只不过;有的程序可以支持多个窗口;有个只有1个
3: 浏览器有多个窗口
系统窗口 与程序窗口的通信;是进程 导致了;【进程通信】—概念

浏览器窗口中可以加载页面,页面中可以嵌套 ifarame 窗口 iframe 窗口可以加载页面

1: 浏览器默认是无名的
2: iframe 窗口 默认无名字,可以通过name 属性 【起个名字】 例如name = content 窗口叫: content
3: 有名字的窗口优先查找,
- 通过target 属性的【值】查找窗口名字。
- 在查找到窗口中加载【页面】
- 加载 href中的链接页面

a 标签 加载页面 查找窗口的方式

1:第一步:在自己当前的页面中找;看是否有这个窗口;如果没有
2:第二步 : 在自己的上一层窗口中找;看是否有要找的窗口 有 就在该窗口中加载页面
3:直到找到 浏览器窗口为止;打开新的浏览器窗口

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值