`
ynp
  • 浏览: 428550 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

js权威指南读书笔记2

阅读更多
==========
1、客户端javscript中 全局对象时window
var a="nihao";
window.b = "nihao!";//等同于上一句
console.log(window.a);
console.log(a);
console.log(window.b);//nihao!
console.log(b);//nihao!
2、同源策略
当一个web页面使用多个帧(包括<iframe>标记)或者打开其他浏览器窗口,这一策略发挥作用。
3、帧之间访问
包括 父子帧之间、兄弟帧之间
书上P295 图14-3 很好体现的帧之间的关系

--》父帧
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>iframe测试程序</title>
<script type="text/javascript" >
//父帧的方法
function test(){
console.log("parent中的方法!")
}
//调用子帧的方法(两种方式)
function callChildIframe(){
//frames[0].iframeTest();
parent.iframe1.iframeTest();//必须加parent,且iframe标签必须用name 不能用id
}

</script>
</head>
<body>
<iframe name="iframe1" src="iframe.html"  width="100%" height="90%"></iframe>
<iframe name="iframe2" src="iframe2.html"  width="100%" height="90%"></iframe>
<input type="button" id="mb1" value="调用子帧的方法" onclick="callChildIframe()"/>
</body>
</html>

--》子帧1
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script language="javascript" type="text/javascript">
   //子帧的方法
function iframeTest(){
console.log("子帧的方法!");
}
   //调用父帧中的方法(三种方式)
function callParentTest(){
//parent.test();
//top.test();//不管帧有多少层次直接跳到顶层
var parentTest = top.test;
parentTest();
}

   //调用兄弟帧中的方法(两种方式)
function callbratherTest(){
//parent.frames[1].iframe2Test();
parent.iframe2.iframe2Test();
}
</script>
</head>
<body">
<input type="button" id="mb2" value="调用父帧中的test方法" onclick="callParentTest()" /> <br>
<input type="button" id="mb2" value="调用兄弟帧中的test方法" onclick="callbratherTest()" /> <br>
</body>
</html>


--》子帧2
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script language="javascript" type="text/javascript">
//子帧的方法
function iframe2Test(){
console.log("子帧2的方法!!");
}

</script>
</head>
<body">
</body>
</html>
分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics