读书笔记 - js高级程序设计 - 第八章 BOM
Posted 阿里P7之路
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了读书笔记 - js高级程序设计 - 第八章 BOM相关的知识，希望对你有一定的参考价值。
|
BOM的核心对象是window
|
它表示浏览器的一个实例，在浏览器中，window对象有双重角色，它既是通过js访问浏览器窗口的一个接口，又是ECMAScript规定的Global对象，这意味着在网页中定义的任何一个对象，变量 和 函数
都以window作为其Global函数
|
|
窗口关系和frame
|
每个frame都有自己的window对象，并且保存在frames集合中，
在frames集合中，可能通过数值索引 或者 框架名称来访问 相应的 window 对象
|
|
top
|
始终指向 最高层的 框架，也就是浏览器窗口
|
|
self
|
始终指向 window
引入self对象的目的，只是为了与top和parent对象对应起来，因此它不格外包含其它值
|
|
确定和修改window对象位置的属性和方法
|
var leftPos = ( typeof window.screenLeft == "number" ) ? window.screenLeft : window.screenX ;
var topPos = ( typeof window.screenTop == "number" ) ? window.screenTop: window.screenY ;
|
|
将窗口移动到屏幕左上角
|
window.moveTo( 0, 0 ) ; //在Opera或IE7里可能不管用
|
| 将窗口向下移动 100 像素 |
window.moveBy( 0, 100 ) ;//在Opera或IE7里可能不管用
|
|
将窗口移动到（200,300 ）
|
window.moveTo( 200, 300 );//在Opera或IE7里可能不管用
|
|
将窗口向左移动 50 像素
|
window.moveBy( -50, 0 ) ;v
|
|
如何确定页面视口的大小
|
var pageWidth = window.innerWidth ;
var 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 = ducument.body.clientHeight ;
}
}
|
|
缩放窗口
|
window.resizeTo( 100, 100 ) ;//在Opera或IE7里可能不管用
window.resizeBy( 100, 50 ) ; //在Opera或IE7里可能不管用
|
|
导航和打开窗口
|
|
|
|
|
以上是关于读书笔记 - js高级程序设计 - 第八章 BOM的主要内容，如果未能解决你的问题，请参考以下文章