javascript中top的作用

最新推荐文章于 2022-12-15 09:51:32 发布

huangxy10

最新推荐文章于 2022-12-15 09:51:32 发布

阅读量3k

点赞数 2

分类专栏：前端开发—html-css-js-ajax

前端开发—html-css-js-ajax 专栏收录该内容

17 篇文章

订阅专栏

本文通过示例展示了如何在嵌套的HTML框架中使用JavaScript的top属性来访问顶层框架对象及其变量。通过A.html、B.html和C.html三个页面的实例说明了不同层级iframe中的脚本如何获取顶层窗口的信息。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

top作用是取得最顶层框架对象

A.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=gb2312" />

< title > prototype test </ title >

</ head >

< body >

< iframe src ="b.html" ></ iframe >

< script language ="javascript" >

var topstr = "my top";

alert(a.html='+top.location.href);

</script>

</body>

</html>B.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=gb2312" />

< title > prototype test </ title >

</ head >

< body >

< iframe src ="c.html" ></ iframe >

< script language ="javascript" >

alert('b.html='+top.location.href+";a.html.topstr="+top.topstr);//top.topstr可取a.html(顶层框架参数)的topstr变量

</ script >

</ body >

</ html >

C.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=gb2312" />

< title > prototype test </ title >

</ head >

< body >

< script language ="javascript" >

alert('c.html='+top.location.href+";a.html.topstr="+top.topstr);//top.topstr可取a.html(顶层框架参数)的topstr变量

</ script >

</ body >

</ html >

b.html中的top=parent c.html中的top=parent.parent

http://blog.youkuaiyun.com/good_youth/article/details/2079416