浏览器常用对象简介

       所有浏览器通用的对象包括document、navigator、history、screen和location。document对象表示页面；history对象包含用户访问页面的历史信息；navigator对象包含浏览器的信息screen对象包含了客户端显示能力的信息location对象包含了当前页面的位置信息。但最常用的应该是window对象：

       1.window对象 

        window对象代表浏览器的框架或窗口，其中也包含了网页;它是全局对象，因而不用使用其名称来访问其属性和方法，比如alert()函数，其实就是window对象的alert()方法。故：

alert("Hello everyone");
window.alert("Hello everyone");

    上面两行代码效果完全相同。

window对象不但充当全局作用域，而且表示浏览器窗口。

window对象有innerWidth和innerHeight属性，可以获取浏览器窗口的内部宽度和高度。内部宽高是指除去菜单栏、工具栏、边框等占位元素后，用于显示网页的净宽高。与之对应，还有outerWidth和outerHeight属性，可以获取整个浏览器窗口的宽度和高度。如下：

alert('window inner size: ' + window.innerWidth + ' x ' + window.innerHeight);//内宽高;
alert('window outer size: ' + window.outerWidth + ' x ' + window.outerHeight);//整个浏览器宽高;

2.history对象

    history对象跟踪用户访问的每一个页面，这个页面列表通常被称为历史栈，它允许用户单击浏览器的“前进”，“后退”按钮来重新访问页面，与JavaScript的数组对象类型相似，也拥有length属性，使用它可以获得历史栈的页面个数。history对象有back()和go()方法，用户单击浏览器的“前进”，“后退”按钮来重新访问页面的功能就可以用back()和go()方法来实现。在back()和go()方法的括号中有一个参数，我们就通过这个参数来访问历史栈中往前、往后的页面，如下：

history.go(-2);//向后退两个页面；
history.go(3);//向前进三个页面；

 back()方法用法与go()类似，只是前进、后退方向与go()方法相反。

3.location对象

    location对象包含了大量与当前页面相关的有用信息。它不仅包含了页面的统一资源定位器（URL），还包含了保存了页面的服务器、链接服务器的端口号及所使用的协议。分别可以通过location对象的herf、hostname、port和protocol属性获得这些信息。

除此之外，使用location对象的方法还可以改变当前页面的位置，或者刷新页面。可以采用两种方式导航到另一个页面，例如，要用myPage页面替换当前页面：

window.location.replace("myPage.html");//使用replace()方法
window.location.herf="myPage.html";//使用设置herf属性的方法

 由于window对象是全局的，因此上面代码也可以这样写：

location.replace("myPage.html");//使用replace()方法
location.herf="myPage.html";//使用设置herf属性的方法；

4.navigator对象

    navigator对象是window对象的属性它包含了浏览器和运行浏览器的操作系统的大量信息。他最常用的属性有：navigator.appName：浏览器名称，navigator.appVersion：浏览器版本，navigator.language：浏览器设置的语言，navigator.platform：操作系统类型，navigator.userAgent：浏览器设定的User-Agent字符串。

5.screen对象

对象表示屏幕的信息，常用的属性有：screen.width：屏幕宽度（以像素为单位），screen.height：屏幕高度（以像素为单位），screen.colorDepth：返回颜色位数，如8、16、24

6.document对象

document对象也是最常用的对象之一，但不同浏览器的document对象存在较大的差异，但它依然有一些同于的属性和方法，比如write()方法和bgcolor()方法，使用方法也很简单：

document.bgColor="red';//设置页面背景色为红色
document.write("this is red color ");//在页面上显示字符串"this is red color "

以上只是对浏览器的简要介绍，仅供了解。 

 

评论

1 楼 chenyue1 2016-09-20  

总结的很详细，一看便知比较用心在写，描述性语句和例子都很合适，继续努力！