点击嵌套页面的返回顶部父级页面不动的问题?

1、我在一个页面里面嵌套了顶部和底部两个页面。
2、底部页面有一个返回顶部的a标签。
3、想要的效果:点击底部的a标签,使页面重新从顶部开始显示。就是返回顶部的效果。

以下是用一些代码列子说明我的布局。
图片说明
图片说明
图片说明

这个是1.html

    <iframe src="2.html" frameborder="0" scrolling="no" height="40px" width="100%"></iframe>
    <div style="background: red;width: 50%;height: 3000px;margin: 0 auto;"></div>
    <iframe src="3.html" frameborder="0" scrolling="no"  height="40px" width="100%"></iframe>

这个是2.html。是顶部的iframe内容。


    <div style="background: blue;width: 40%;height: 20px;margin: 0 auto;" id="logo">

    </div>
    ```
这个是3.html。是底部的iframe内容。

<div style="background: yellow;width: 50%;height: 20px;margin: 0 auto;text-align: center;">
<a href="#logo" id="toTop">回到顶部</a>
</div>

这样做是不行的,对于不同的dom树来说,伪链是无法进行跳转的。
对于浏览器来说,每一个iframe里面内部都是一个dom,所以#logo只能是3.html内部的元素的时候才能进行跳转的。
如果想在不同frame中进行跳转的话只有通过javascript进行操作,3.html中调用1.html的javascript方法,1.html来调用2.html的方法,才能实现类似的效果