浏览器常用对象简介 博客分类: JavaScript基础 浏览器基础
所有浏览器通用的对象包括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 "
以上只是对浏览器的简要介绍,仅供了解。
推荐阅读
-
浏览器常用对象简介 博客分类: JavaScript基础 浏览器基础
-
javascript history对象(历史记录)使用方法(实现浏览器前进后退)_基础知识
-
JavaScript基础4 浏览器对象
-
JavaScript入门教程(4) js浏览器对象_基础知识
-
JavaScript入门教程(4) js浏览器对象_基础知识
-
JavaScript中的Navigator浏览器对象_基础知识
-
JavaScript 浏览器对象模型BOM使用介绍_基础知识
-
JavaScript 浏览器对象模型BOM使用介绍_基础知识
-
JavaScript中的Navigator浏览器对象_基础知识
-
javascript history对象(历史记录)使用方法(实现浏览器前进后退)_基础知识