8.1window对象
BOM的核心对象是window,表示浏览器的一个实例。
window对象有双重角色,既可以通过就是访问浏览器窗口的接口,又是ECMAscript规定的Global对象
 
8.1.1全局作用域
定义全局变量与在window对象上直接定义属性的差别在于全局变量不能通过delete操作符删除,而直接子啊window对象的定义的属性可以
 
常识访问未声明的变量会抛出错误。但是通过查询window对象可以知道某个未声明的变量是否存在
 
8.1.2 窗口关系及框架

如果页面中有frames,则每个frames都拥有自己的window对象,并且保存在frames对象中。

可以用window.frames[0]或者window.frames[framesName]来引用框架

8.1.3 窗口的位置

moveTo():接收新位置的x,y坐标值

moveBy():接收在水平和垂直方向上移动的像素数

8.1.4 窗口大小

resizeTo():接收浏览器窗口的新宽度和新高度

resizeBy():接收新窗口与原窗口的宽度和高度之差

var pageWidth = window.innerWidth,

pageHeight = window.innerHeight;

if(typeof pageWidth != ‘number’){

if(document.compatMode == ‘CSS1Compat’){

pageWidth = document.documentElement.clientWidth;

pageHeight = document.documentElement.clientHeight;

} else {

pageWidth = document.body.clientWidth;

pageHeight = document.body.clientHeight;

}

}

FireFox,Safari,Opera和Chrome有4个属性:innerWidth,innerHeight,outerWidth,outerHeight。在Safari和FireFox,outerWidth和outerHeight返回浏览器窗口本身的尺寸。Opera中这两个属性表示页面视图容器的大小。而innerWidth和innerHeight表示该容器中页面视图区的大小。在Chrome中,outerWidth,outerHeight与innerWidth,innerHeight返回的相同的值,即视口的大小而非浏览器窗口的大小。

在ie6标准模式下:document.documentElement.clientWidth, document.documentElement.clientHeight这两个值有效,而在混杂模式下:则通过document.body.clientWidth,document.body.clientHeight,而在chrome下这两种方式都可以取得相同的值。

8.1.5 导航和打开窗口

window.open();

8.1.6 间歇调用和超时调用

setTimeout(),setInterval();
 
8.1.7 系统对话框
alert(),confirm()和prompt();
 
8.2location对象
location提供与当前窗口中加载的文档有关的信息
它既是window对象又是document对象
 
8.2.1查询字符串参数
location.search返回从问号到URL末尾的所有内容,但却没有办法逐个访问其中的每个查询字符串参数
 
8.2.2位置操作
location.href()
通过location.href会是浏览器中生成一条新记录,因此用户单击“后退”按钮都会导航到前一个页面,要禁用这种行为,可以使用location.replace方法。
location.reload():重新加载(有可能从缓存中加载)
location.reload(true):重新加载(从服务器重新加载);

js高级程序设计第八章BOM(未完成,待续)的更多相关文章

  1. 读书笔记 - js高级程序设计 - 第八章 BOM

      BOM的核心对象是window 它表示浏览器的一个实例,在浏览器中,window对象有双重角色,它既是通过js访问浏览器窗口的一个接口,又是ECMAScript规定的Global对象,这意味着在网 ...

  2. js高级程序设计笔记之-addEventListener()与removeEventListener(),事件解除与绑定

    js高级程序设计笔记之-addEventListener()与removeEventListener(),事件解除与绑定 addEventListener()与removeEventListener( ...

  3. 《JS高级程序设计》笔记 —— 解析查询字符串

    今天在继续翻阅<JS高级程序设计>的时候,正好翻到location对象这一小节,其中有一部分就是讲的解析查询字符串.看到这个内容立马想到了做去哪儿秋招笔试题的时候有这么一道题. 去哪儿笔试 ...

  4. angular.js高级程序设计书本开头配置环境出错,谁能给解答一下

    server.jsvar connect=require('connect');serveStatic=require('serve-static');var app=connect();app.us ...

  5. 读书笔记 - js高级程序设计 - 第十五章 使用Canvas绘图

    读书笔记 - js高级程序设计 - 第十三章 事件   canvas 具备绘图能力的2D上下文 及文本API 很多浏览器对WebGL的3D上下文支持还不够好   有时候即使浏览器支持,操作系统如果缺缺 ...

  6. JS高级程序设计拾遗

    <JavaScript高级程序设计(第三版)>反反复复看了好多遍了,这次复习作为2017年上半年的最后一次,将所有模糊的.记不清的地方记录下来,方便以后巩固. 0. <script& ...

  7. 笔记-JS高级程序设计-BOM篇

    BOM提供了很多对象,用于访问浏览器的功能.这些功能与任何网页无关. 1BOM的核心对象是window,它代表浏览器的一个实例,它是通过JS访问浏览器窗口的一个借口,同时又是ECMAScript规定的 ...

  8. js高级程序设计(七)BOM

    window 对象 BOM 的核心对象是window,它表示浏览器的一个实例.在浏览器中,window 对象有双重角色,它既是通过JavaScript 访问浏览器窗口的一个接口,又是ECMAScrip ...

  9. JS高级程序设计学习笔记之第三章基本概念(语法,数据类型,流控制语句,函数)——查漏补缺

    一.语法: 区分大小写; 2.标识符:就是指变量.函数.属性的名字,或者函数的参数 a.标志符的规则:①第一个字符必须是一个字母.下划线(_)或一个美元符号($).                   ...

随机推荐

  1. django 网站项目测试

    视图和 URL 配置: 在先前创建的 meishiweb目录下的 meishiweb 目录新建一个 view.py 文件,并输入代码: 此时在浏览器即可访问: 证明已经成功 我们也可以修改成以下的规则 ...

  2. 51nod 1068 Bash游戏 V3

    列出前几项可以发现是个规律题,不要被题目的文字所欺骗,字符串处理10^1000即可 #include <bits/stdc++.h> using namespace std; int ge ...

  3. 题解报告:hdu 2602 Bone Collector(01背包)

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=2602 Problem Description Many years ago , in Teddy’s ...

  4. 2、IO流的分类和IO流体系

  5. Eclipse快捷键集合

    ***eclipse查看哪个方法被调用:选中,右键选择Open call Hierarchy     选择要查看的方法: ctrl + alt + h       查看一个类被那些类继承或者实现: F ...

  6. solr之~模糊查询【转】

    solr之~模糊查询 有的时候,我们一开始不可能准确地知道搜索的关键字在 Solr 中查询出的结果是什么,因此,Solr 还提供了几种类型的模糊查询.模糊匹配会在索引中对关键字进行非精确匹配.例如,有 ...

  7. Elixir安装

    参考:https://laravel.com/docs/5.2/elixir 1. 安装node 去这里下载 2.可以用淘宝的cnpm加速! npm install -g cnpm --registr ...

  8. 【开源】基于EF6+MVC5+API2+Easyui1.4.5+Easyui管理模板开发的管理系统

    经过近一步完善调整,现将本系统源码正式开放,定名为:EasyuiAdminFramework,另外EasyuiAdminTemplate及EasyuiFlatTheme也一并开源 项目主页:http: ...

  9. bootstrap不同屏幕区分数值

    @media (min-width:1200px){ } @media (min-width:992px) and (max-width:1199px){ } @media (min-width:76 ...

  10. xmind8 Mac破解版(思维导图) 附序列号

    链接: https://pan.baidu.com/s/1PNdLRGpz_jhfPmWAIbLRfw 提取码: ruvm 复制这段内容后打开百度网盘手机App,操作更方便哦 小伙伴们XMind 8 ...