javaScript学习4

1.框架

在一个普通HTML文档载入浏览器的同时还创建了一个模型，这个模型始于一个window对象和它包含的文档。单框架窗口和文档很很简单，window下就是document。如果框架文档载入浏览器时就会建立一个稍微不同一样的层次模型。

<html>

<frameset cols="50%,50%">

    <frameset name="leftFrame" src="js_06.html"></frameset>

    <frameset name="rightFrame" src="js_05.html"></frameset>

</frameset>

</html>

1.1 父到子的引用

父窗口中包含两个或多个框架，就是说父窗口包含子框架对象的一个数组。可以通过数组语法或者框架名定位一个框架，框架名可以用<frame>标记中的name属性来进行设置。

[window.]frames[n].objFuncVarName

[window.]frames["frameName"].objFuncVarName

[window.]frameName.objFuncVarName

1.2 子到父的引用

从子框架的角度来看，它的上一层称为parent（父层），因为从子框架到父层的元素的引用很简单parent.objFuncVarName

1.3 子到子的引用

任何窗口或者框架都拥有parent属性，引用必须使用parent属性来跳出当前框架，并转到所有子框架的公有框架中，以上例子中的LeftFrame到RightFrame可以用parent,这样和父到子引用是一样的

parent.frames[n].objFuncVarName

获得载入框架的document对象，由于浏览器的不同调用不同，IE4+和Safari使用与窗口相同，而MOzilla浏览器更严格遵循W3C DOM标准，使用comentDocument属性

var docObj;

var frameObj=document.getElementById("myFrame");

if(frameObj.contentDocument){

    docObj=frameObj.contentDocument;

}else{

    docObj=frameObj.document;

}

1.4 多窗口引用

window.open()方法返回window对象引用创建了一个新窗口并与它通信。

每个window对象都有一个opener的属性，该属性包含窗口和框架的引用，这些窗口或者框架存放一些脚本，脚本的window.open()语句生成子窗口。

我们可以这样编程

js_9.html代码如下：

<html>

<head>

    <title>js_9</title>

    <script type="text/javascript">

        function newSubWindows(){

            window.open("js_10.html","sub","height=200,width200");

        }

    </script>

</head>

<body>

<form>

<input type="button" name="" value="create clone" onclick="newSubWindows()">

<p>there is word from subwindows</p>

<input type="text" name="">

</form>

</body>

</html>

js_10.html代码如下

<html>

<head>

    <title>js_10</title>

    <script type="text/javascript">  

    </script>

</head>

<body>

<form>

    <input name="second" type="text" onchange=" opener.document.forms[0].entry.value=this.value">

</form>

</body>

</html>

点击js_9的create clone，会弹出一个新窗口，在新窗口js_10中输入字符，js_9的输入框会跟着做相应的变化

javaScript学习（4）框架学习的更多相关文章

  1. JavaScript的运动框架学习总结

    一.目录 1. 入门案例——实现匀速运动 2. 入门案例——实现缓冲运动 3. 实现任意值的运动框架v.1 4. 改进任意值的运动框架v.2 5. 改进任意值的运动框架v.3 6. 实现链式运动框架 ...

  2. Javascript之pixi框架学习

    pixi 创建渲染器(renderer) 创建一个可以播放动画的区域,相当于(canvas). var renderer = PIXI.autoDetectRenderer(512, 512); do ...

  3. ABP入门系列（1）——学习Abp框架之实操演练

    作为.Net工地搬砖长工一名,一直致力于挖坑(Bug)填坑(Debug),但技术却不见长进.也曾热情于新技术的学习,憧憬过成为技术大拿.从前端到后端,从bootstrap到javascript,从py ...

  4. 2013 最新的 play web framework 版本 1.2.3 框架学习文档整理

    Play framework框架学习文档 Play framework框架学习文档 1 一.什么是Playframework 3 二.playframework框架的优点 4 三.Play Frame ...

  5. Yii框架学习 新手教程（一）

    本人小菜鸟一仅仅,为了自我学习和交流PHP(jquery,linux,lamp,shell,javascript,server)等一系列的知识,小菜鸟创建了一个群.希望光临本博客的人能够进来交流.寻求 ...

  6. JQuery EasyUI框架学习

    前言 新项目的开发前端技术打算採用EasyUI框架(基于EasyUI较为丰富的UI组件库),项目组长将前端EasyUI这块的任务分配给了我.在进行开发之前,须要我这菜鸟对EasyUI框架进行一些基础的 ...

  7. TypeScript基本知识（为学习AngularJS2框架做个小铺垫）

    学习angularjs2框架,需要了解一些TypeScript知识点,基本了解下面这几个知识点学习AngularJS2 就够用了 1.TypeScript 1.1显示类型的定义 TypeScript类 ...

  8. 学习测试框架Mocha

    学习测试框架Mocha 注意:是参考阮老师的文章来学的.虽然阮老师有讲解,但是觉得自己敲一遍,然后记录一遍效果会更好点.俗话说,好记性不如烂笔头. Mocha 是javascript测试框架之一,可以 ...

  9. 《零基础学JavaScript(全彩版)》学习笔记

    <零基础学JavaScript(全彩版)>学习笔记 二〇一九年二月九日星期六0时9分 前期: 刚刚学完<零基础学HTML5+CSS3(全彩版)>,准备开始学习JavaScrip ...

  10. jQuery框架学习第十一天：实战jQuery表单验证及jQuery自动完成提示插件

    jQuery框架学习第一天:开始认识jQueryjQuery框架学习第二天:jQuery中万能的选择器jQuery框架学习第三天:如何管理jQuery包装集 jQuery框架学习第四天:使用jQuer ...

随机推荐

  1. js操作cookie的一些注意项

     这两天做购物车逻辑.依照通常的做法,把预购信息存放在cookie里,结果发生了非常多不可理喻的事情,完整的证明了我对cookie的无知. . . 这么多年.非常少用cookie,由于认为它不安全 ...

  2. [Spring Framework]学习笔记－－@Component等stereotype的基础

    在继续讲解Spring MVC之前,需要说一下常用的几个用来标记stereotype的annotation. @Component,@Controller,@Repository,@Service. ...

  3. javaweb reponse 写出文件

    Map map = getSearchValue(); File excelFile = orderService.getexportexcel(id,map); InputStream is = n ...

  4. ibatis中in语句参数传入方法

    第一种:传入参数仅有数组,iterate中不能有数组的属性名       <select id="GetEmailList_Test"  resultClass=" ...

  5. python学习笔记（5）--泡菜：永久存储

    说明: 1. 导入pickle泡菜模块. 2. wb方式(二进制)创建.pkl文件. 3. pickle.dump把一个数组或什么数据灌进这个新建的文件. 4. 然后就生成了一个pkl文件,用来存放数 ...

  6. word字号

    1 大特号 63 2 特 号 54 3 初 号 42 4 小初号 36 5 大一号 31.5 6 一 号 28 7 小一号 24 8 二 号 21 9 小二号 18 10 三 号 16 11 小三号  ...

  7. SAN和NAS的区别: 层次不一样

    SAN : STORAGE AREA NETWORK   存储区域网络 NAS : NETWORK ATTACHED STORAGE 网络附加存储 NAS不一定是盘阵,一台普通的主机就可以做出NAS, ...

  8. PHP 安全三板斧：过滤、验证和转义之转义篇 & Blade模板引擎避免XSS攻击原理探究

    PHP 转义 实现 把输出渲染成网页或API响应时,一定要转义输出,这也是一种防护措施,能避免渲染恶意代码,造成XSS攻击,还能防止应用的用户无意中执行恶意代码. 我们可以使用前面提到的 htmlen ...

  9. 关于Unity屏幕分辨率的比例

    1.Free Aspect任意窗口大小 2.16:9是1920*1080的手机 3.4:3是1024*768ipad 4.3:2是960*640,iPhone4手机屏幕 5.480*800,竖屏手机游 ...

  10. Spring Boot可以离开Spring Cloud独立使用开发项目，但是Spring Cloud离不开Spring Boot，属于依赖的关系。

    Spring Boot 是 Spring 的一套快速配置脚手架,可以基于Spring Boot 快速开发单个微服务,Spring Cloud是一个基于Spring Boot实现的云应用开发工具:Spr ...