浏览器对象模型

最新推荐文章于 2022-05-30 12:00:00 发布

Suprman

最新推荐文章于 2022-05-30 12:00:00 发布

阅读量1.2k

点赞数 1

分类专栏： J2ME手机开发 MS Windows Web网页技术组件编程 ActiveX 系统安全 JavaScript Web平台开发基础文章标签： JavaScript 脚本编程

本文链接：https://blog.csdn.net/Suprman/article/details/83301779

版权

MS Windows 同时被 3 个专栏收录

199 篇文章 0 订阅

订阅专栏

Web网页技术

100 篇文章 0 订阅

订阅专栏

系统安全

93 篇文章 0 订阅

订阅专栏

浏览器对象模型 (BOM) 是一种特定于浏览器的约定，是Web浏览器公开的所有对象。当浏览器解析一个文档时，它会创建一个对象集合，用于描述文档和如何显示它们的细节。浏览器创建的这个对象称为文档对象。它是浏览器使用的大集合对象的一部分。浏览器对象的这个集合称为浏览器对象模型，或BOM。BOM不是ECMAScript标准规范，尽管它是JavaScript核心部分所描述的。重要的BOM对象如下:

document文档
location位置
history历史
navigator导航
screen屏幕
frames框架

有一个浏览器对象的层次框架，可以用于与浏览器自身相联系的方法和属性的操作上。在BOM里的最顶级对象是窗体window对象。窗体对象代表浏览器窗口。其他全部浏览器对象都包含在窗体对象里面。窗体对象具有一些属性和方法，可以用它们操控网页浏览器。客户端Web开发的很好的一部分是尽量使用与浏览器本身相关的属性和方法，和占用它们的文档。

浏览器窗口被称为窗口对象的一个全局对象所表示。这个窗口对象被所有主流浏览器支持，并且包括全部的JavaScript全局对象。任何函数，对象，或变量，在JavaScript里都是窗口对象的一个成员。下面是几个窗口对象的属性和方法实例：

window.open("", newWindow, "width=500, height=500");
window.frames[0].location = "http://net-informations.com";
window.close();
var winWidth = window.innerwidth;
var winHeight = window.innerHeight;
window1.moveTo(500, 300);
window1.focus();

文档元素是DOM元素的根，在对象层次框架里面是BOM的一部分。文档对象模型表示显示在浏览器当中的网页。网页里面的全部元素，包括HTML标签，都包括在文档对象里面。由于文档对象经常被作为BOM的最重要的部分而考虑，它表示自己的对象模型，通常被称为文档对象模型DOM。不像文档对象模型，因为没有实现的标准，没有严格的定义，所以浏览器发布者可以按他们自己的愿望自由实现BOM。所有的全局对象，函数，JavaScript变量都是缺省的窗口对象成员。当访问它的大部分元素的时候，JavaScript 允许 window引用被省略。全局对象的例子如下：

window.document.getElementById("Para1");
document.getElementById("Para1");

上面例子当中的两个语句意思是一样的。

BOM例子

<!DOCTYPE html>
<html>
<head>
<title>BOM Examples</title>
<script>
var browserInfo = window.navigator.appName + " " + window.navigator.appVersion;
document.write("<h2>Browser Info</h2><p>"+browserInfo +"</p>");
var newWindow;
function opennewWindow() {
newWindow = window.open("", "", "width=500, height=300, top=150, left=150");
newWindow.document.title = "New Window";
paraGraph = document.createElement("P");
paraGraph_text = document.createTextNode("New Paragraph");
paraGraph.appendChild(paraGraph_text);
newWindow.document.body.appendChild(paraGraph);
}
function closenewWindow() {
if (newWindow != undefined) {
newWindow.close();
newWindow = undefined;
}
else {
alert("Nothing to open !!");
}
}
</script>
</head>
<body>
<h2>BOM Window Object</h2>
<p>
<input type="button" value="Open Window" onclick="opennewWindow()" />
<input type="button" value="Close Window" onclick="closenewWindow()" />
</p>
</body>
</html>

JavaScript教程