欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

浏览器常用对象简介 博客分类: JavaScript基础 浏览器基础 

程序员文章站 2024-03-21 16:02:52
...

       所有浏览器通用的对象包括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 "

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

 

相关标签: 浏览器基础