标签：窗口 对象 javascript window BOM 操作 浏览器 document 页面
浏览器对象模型 BOM
基本的BOM体系结构：
一、 window对象
window对象是BOM对象的核心。所有对象和集合都以某种方式回接到window对象。
alert(window.document === document); true
window对象表示整个浏览器窗口。如果页面使用框架集合，每个框架都由它自己的window对象表示，存放在frames集合中。
window.frames[0] window.frames[“name”] 也可以直接用框架的名字。如window.leftframe。不过用frames集合更常用。
top对象指向的都是最顶层的框架。top.frames[0]
由于window对象是整个BOM对象的中心，所以不需要明确引用它。window.frames[0]可以写成frames[0]。
parent对象
Window 对象的 window 属性和 self 属性引用的都是它自己。当你想明确地引用当前窗口，而不仅仅是隐式地引用它时，可以使用这两个属性。
要引用窗口中的一个框架，可以使用如下语法：
frame[i] //当前窗口的框架
self.frame[i] //当前窗口的框架
w.frame[i] //窗口 w 的框架
要引用一个框架的父窗口（或父框架），可以使用下面的语法：
parent //当前窗口的父窗口
self.parent //当前窗口的父窗口
w.parent //窗口 w 的父窗口
要从顶层窗口含有的任何一个框架中引用它，可以使用如下语法：
top //当前框架的顶层窗口
self.top //当前框架的顶层窗口
f.top //框架 f 的顶层窗口
新的顶层浏览器窗口由方法 Window.open() 创建。当调用该方法时，应把 open() 调用的返回值存储在一个变量中，然后使用那个变量来引用新窗口。新窗口的opener 属性反过来引用了打开它的那个窗口。
以下内容在火狐、谷歌、IE、opera、safari浏览器下测试（除IE外均用最新版本测试）
属性
作用
浏览器兼容性及说明
window对象
集合
frames
页面使用的框架的集合
属性
closed
返回窗口是否已被关闭。(true、false)
screenLeft
screenTop
浏览器窗口的位置
IE
screenX
screenY
浏览器窗口的位置
IE除外、opera有问题
innerWidth
innerHeight
浏览器窗口可以显示网页内容的区域(即：不包括标签栏、导航栏等)的高度、宽度
IE除外
outerWidth
outerHeight
浏览器窗口 (即：包括标签栏、导航栏等)的高度、宽度
IE除外
status
并不是在所有浏览器上都可以，现在多说浏览器需要用户手动启用设置。
defaultStatus
name
设置或返回窗口的名称
opener
返回对创建此窗口的窗口的引用。
方法
open()
打开新的窗口（现代浏览器大多会拦截弹出窗口）
该方法接受四个参数，url,新窗口的名字（为目标所用）、特性字符串(特性字符串使用都好分割的设置列表，具体参看手册)和说明是否用新载入的页面替换当前载入的页面的Bolean值。
var dxk = window.open("http://www.baidu.com/", "", "left=10px, top=20px, width=400px, resizable=no, toolbar=no");
dxk.close();
close()
关闭窗口，可以关闭创建的也可以关闭自身。
setTimeout()
接受两个参数，要执行的代码和在执行他之前要等待的毫秒数。第一个参数可以是代码传(与eval()函数的参数相同)，也可以是函数指针。
setTimeout(hello, 1000);
setTimeout(‘hello(“wuhui”)’,1000);
区别：第二种有引号可以加参数。
clearTimeout()
setInterval()
clearInterval()
moveBy(x,y)
不用写单位值，它的单位是像素
moveTo(x,y)
resizeBy(x,y)
resizeTo(x,y)
不能使用负数
alert()
confirm()
prompt()
blur()
焦点从顶层窗口移开
focus()
焦点给予一个窗口
createPopup()
var p = window.createPopup();
var pbody = p.document.body; pbody.style.backgroundColor = "red"; pbody.style.border = "solid black 1px";
pbody.innerHTML = "这是一个 pop-up！在 pop-up 外面点击，即可关闭它！";
p.show(150, 150, 200, 50, document.body);
仅IE
print()
打印当前窗口的内容
history对象
属性
length
方法
go()
back()
forward()
document对象
alert(window.document === document); true这个对象的独特之处是它是唯一一个既属于BOM又属于DOM的对象（从BOM角度看，document对象由一系列集合构成，这些集合可以访问文 档的各个部分，并提供页面自身的消息。）
集合
all
提供对文档中所有 HTML 元素的访问
仅IE支持document.all
但是测试document.all.length是也发现只有firefox不支持document.all.length
anchors
页面中所有锚的集合(由<a name=”wuhui”></a>表示)
applets
所有applet的集合
embeds
所有嵌入式对象的集合（由<embed />标签表示）
forms
所有表单的集合
document.forms["wuhui"]["name"].value;
document.forms[0][0].value;
images
所有图像的集合
可以用document.images[0]或者document.images[“name”]（也就是img标签的name属性值）访问图像
document.images[0].src
links
所有Area 和 Link 对象的集合（由<a href = http://www.dxk.com/>杜晓孔</a>表示）
注意锚和链接的区别
属性
title
可读可写。
top.document.title = “wuhui”;
URL
返回当前文档的 URL。
IE可读可写，其它浏览器只读。
domain
返回当前文档的域名。
referrer
返回载入当前文档的文档的 URL。(可用于统计访问来源，同样也可以用服务器端技术实现)
lastModified
最后修改页面的日期（同样也可以用服务器端技术实现）
cookie
方法
write()
writeln()
这两个方法都会把字符的内容串插入到调用它们的位置。（必须在完全载入页面之前调用此方法，如果在页面载入后调用，它将抹去页面的内容，显示指定的内容）
参数为要写入文档的字符串
var oNewWin = window.open("about:blank", "newwindow", "height=150,width=300,top=10,left=10,resizable=no");
oNewWin.document.open();
oNewWin.document.write("<html><head><title>New Window</title></head>");
oNewWin.document.write("<body>This is a new window!</body></html>");
oNewWin.document.close();
open()
close()
location对象
BOM对象中最有用的对象之一是location对象，它是window对象和document对象的属性
属性
hash
例子：1.http://www.baidu.com/s?wd=js
host
hostname
href
pathname
port
protocol
search
方法
assign()
加载一个新的文档
replace()
它与location.href不太一样，location.href就好像是用户点击了某个链接，于是浏览器加载一个新的页面，并且产生了一条历史记录。但是replace()，新页面会覆盖窗口历史记录当前页面的条目（也就是用新的文档替换当前文档）。
reload()
参数为true或false，重新加载当前页面。reload方法有两种模式，参数为false或者省略不写则从缓存中加载数据，如果参数为true则从服务器端载入。
screen对象
属性
availWidth
返回显示屏幕的宽度 (除 Windows 任务栏之外)。
availHeight
返回显示屏幕的高度 (除 Windows 任务栏之外)。
width
返回显示器屏幕的宽度。
height
返回显示屏幕的高度。
Navigator对象
cookieEnabled
返回指明浏览器中是否启用 cookie 的布尔值。
platform
返回运行浏览器的操作系统平台。
userAgent
返回由客户机发送服务器的 user-agent 头部的值。
appName
返回浏览器的名称。(不建议使用)
标签：窗口,对象,javascript,window,BOM,操作,浏览器,document,页面 来源： https://blog.51cto.com/u_15166492/2704007
本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享； 2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关； 3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关； 4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除； 5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。