JavaScript浏览器对象

发表于   |   分类于   |     |   阅读次数

Dom

介绍

浏览器对象

浏览器对象主要有：

History历史对象、

Location地址对象、

document文档对象、

window对象浏览器对象、

Navigator对象(客户机浏览器的信息)、

Screen对象（客户机屏幕的信息）等。

history历史对象

History对象是由浏览器中的脚本引擎自动创建的，由一系列的 URL 组成。这些 URL 是用户在一个浏览器窗口内已访问的 URL 。

History 对象最初设计来表示窗口的浏览历史。但出于隐私方面的原因，History 对象不再允许脚本访问已经访问过的实际URL。

History对象的属性

length 返回浏览器历史列表中的 URL 数量

History对象的方法

back() 加载 history 列表中的前一个 URL

back()方法可加载历史列表中的前一个 URL（如果存在）。调用该方法的效果等价于点击后退按钮 。

history.back()

forward() 加载 history 列表中的下一个 URL

forward()方法可加载历史列表中的下一个 URL。调用该方法的效果等价于点击前进按钮 。

history.forward()

void go(any url) 加载 history 列表中的某个具体页面

go()方法可加载历史列表中的某个具体的页面。

history.go(number|url)

说明：URL 参数使用的是要访问的 URL，或 URL 的子串。而 number 参数使用的是要访问的 URL 在 History 的 URL 列表中的相对位置。

location地址对象

Location对象存储在 Window 对象的 Location 属性中，表示那个窗口中当前显示的文档的 Web 地址。它的 href 属性存放的是文档的完整 URL，其他属性则分别描述了 URL 的各个部分

Location对象

protocol 设置或返回当前 URL 的协议。
hostname 设置或返回当前 URL 的主机名。
port 设置或返回当前 URL 的端口号。
host 设置或返回主机名和当前 URL 的端口号。
pathname 设置或返回当前 URL 的路径部分。
hash 设置或返回从井号 (#) 开始的 URL（锚）。
search 设置或返回从问号 (?) 开始的 URL（查询部分）。
href 设置或返回完整的 URL。

Location对象的方法

void assign(String url) 加载新的文档。

void reload(Boolean flag) 重新加载当前文档。true重新加载，false不重新加载

location.reload(force)

说明：如果该方法没有规定参数，或者参数是 false，浏览器就会检测服务器上的文档是否已改变。如果文档已改变，reload() 会再次下载该文档。如果文档未改变，则该方法将从缓存中装载文档

document文档对象

window浏览器对象

window对象

window对象是BOM层级中的顶层对象。它代表一个浏览器窗口或一个框架

window对象是全局对象，要引用当前窗口根本不需要特殊的语法，可以把窗口对象的属性作为全局变量来使用，可以把窗口对象的方法当作函数来使用。

window对象的方法

alert(String message) 弹出一个警告对话框。参数内容为警告提示语。

confirm(String message) 弹出一个确认对话框。参数内容为提示语。返回值是一个Boolean值，true表示按确定选项，false表示按取消选项。

prompt(String message,String value)弹出一个输入对话框。message参数提示信息，value是输入对话框中的默认值，可以通过输入值进行改变。返回值是String输入对话框的内容。

setInterval()方法可按照指定的周期（以毫秒计）来调用函数或计算表达式，直到 clearInterval() 被调用或窗口被关闭。

setInterval(code,millisec)

code必须。要调用的函数或要执行的代码串。
millisec必须。周期性执行或调用code之间的时间间隔，以毫秒计。

返回值：一个可以传递给 window.clearInterval() 从而取消对 code 的周期性执行的值

clearInterval()方法可取消由 setInterval() 设置的 timeout。clearInterval() 方法的参数必须是由 setInterval() 返回的 ID 值。

clearInterval(id_of_setinterval)

参数id_of_setinterval是由setInterval()返回的ID值

setTimeout()方法用于在指定的毫秒数后调用函数或计算表达式。

setTimeout(code,millisec)

code必需。要调用的函数后要执行的JavaScript代码串。
millisec必需。在执行代码前需等待的毫秒数。

返回值：一个可以传递给 window.clearTimeout() 从而取消对 code 的延时执行的值。

clearTimeout()方法可取消由 setTimeout() 方法设置的 timeout。

clearTimeout(id_of_settimeout)

参数id_of_settimeout是由setTimeout()返回的ID值。
该值标识要取消的延迟执行代码块。

open()方法用于打开一个新的浏览器窗口或查找一个已命名的窗口。

window.open(String URL,String name,String features,Boolean replace)

URL 一个可选的字符串，声明了要在新窗口中显示的文档的 URL。如果省略了这个参数，或者它的值是空字符串，那么新窗口就不会显示任何文档。

name 一个可选的字符串，该字符串是一个由逗号分隔的特征列表，其中包括数字、字母和下划线，该字符声明了新窗口的名称。这个名称可以用作标记 <a> 和 <form>的属性 target 的值。如果该参数指定了一个已经存在的窗口，那么 open() 方法就不再创建一个新窗口，而只是返回对指定窗口的引用。在这种情况下，features 将被忽略。

features 一个可选的字符串，声明了新窗口要显示的标准浏览器的特征。如果省略该参数，新窗口将具有所有标准特征。

replace 一个可选的布尔值。规定了装载到窗口的 URL 是在窗口的浏览历史中创建一个新条目，还是替换浏览历史中的当前条目。支持下面的值：true - URL 替换浏览历史中的当前条目。 false - URL 在浏览历史中创建新的条目。

窗口特征的参数features

width=pixels 窗口的文档显示区的宽度。以像素计。
height=pixels 窗口的文档显示区的高度。以像素计。
left=pixels 窗口的 x 坐标。以像素计。
top=pixels 窗口的 y 坐标。
directories=yes|no|1|0 是否添加目录按钮。默认为 yes。
location=yes|no|1|0 是否显示地址字段。默认是 yes。
menubar=yes|no|1|0 是否显示菜单栏。默认是 yes。
scrollbars=yes|no|1|0 是否显示滚动条。默认是 yes。
status=yes|no|1|0 是否添加状态栏。默认是 yes。
titlebar=yes|no|1|0 是否显示标题栏。默认是 yes。
toolbar=yes|no|1|0 是否显示浏览器的工具栏。默认是 yes。
resizable=yes|no|1|0 窗口是否可调节尺寸。默认是 yes。
fullscreen=yes|no|1|0 是否使用全屏模式显示浏览器。默认是 no。
channelmode=yes|no|1|0 是否使用剧院模式显示窗口。默认为 no。

close()方法用于关闭浏览器窗口。

window.close()

moveBy()方法可相对窗口的当前坐标把它移动指定的像素。

void window.moveBy(Number x,Number y);
x：要把窗口右移的像素数；
y：要把窗口下移的像素数。

moveTo()方法可把窗口的左上角移动到一个指定的坐标。

window.moveTo(Number x,Number y) ;

x：窗口新位置的x坐标；
y：窗口新位置的y坐标。

resizeBy()方法用于根据指定的像素来调整窗口的大小。

void resizeBy(Number width, Number height);

width必需。要使窗口宽度增加的像素数。可以是正、负数值。
height可选。要使窗口高度增加的像素数。可以是正、负数值。

resizeTo()方法用于把窗口大小调整为指定的宽度和高度。

void resizeTo(Number width,Number height);

width必需。想要调整到的窗口的宽度。以像素计。
height可选。想要调整到的窗口的高度。以像素计。

scrollBy()方法可把页面内容滚动指定的像素数。

void scrollBy(Number xnum,Number ynum);

xnum 必需。把文档向右滚动的像素数。
ynum 必需。把文档向下滚动的像素数。

scrollTo()方法可把内容滚动到指定的坐标。

void scrollTo(Number xpos,Number ypos);

xpos 必需。要在窗口文档显示区左上角显示的文档的x坐标。
ypos 必需。要在窗口文档显示区左上角显示的文档的y坐标。

window对象的属性；

Boolean window.closed 窗口是否被关闭。

closed 属性可返回一个布尔值，该值声明了窗口是否已经关闭。该属性为只读。

当浏览器窗口关闭时，表示该窗口的 Windows 对象并不会消失，它将继续存在，不过它的 closed 属性将设置为 true。
String window.name 设置或返回窗口名称

name属性可设置或返回存放窗口的名称的一个字符串。该名称是在 open() 方法创建窗口时指定的或者使用一个 <frame> 标记的 name 属性指定的。窗口的名称可以用作一个 <a> 或者 <form> 标记的 target 属性的值。以这种方式使用 target 属性声明了超链接文档或表单提交结果应该显示于指定的窗口或框架中。

Window window.opener 返回对创建此窗口的窗口的引用。

opener属性是一个可读可写的属性，可返回对创建该窗口的 Window 对象的引用。

注意：只有表示顶层窗口的 Window 对象的 operner 属性才有效，表示框架的 Window 对象的 operner 属性无效。

Window window.parent 返回父窗口

Window window.self 返回对当前窗口的引用。等价于 window 属性。

Window window.top 返回最顶层的先辈窗口。

该属性返回对一个顶级窗口的只读引用。如果窗口本身就是一个顶级窗口，top 属性存放对窗口自身的引用。如果窗口是一个框架，那么 top 属性引用包含框架的顶层窗口。

Number window.screenLeft 窗口的左上角在屏幕上的的 x 坐标
Number window.screenX 窗口的左上角在屏幕上的的 x 坐标

Number window.screenTop 窗口的左上角在屏幕上的的 y 坐标
Number window.screenY 窗口的左上角在屏幕上的的 y 坐标

HTMLDocument window.document 对 Document 对象的只读引用

History window.history 对History对象的只读引用

Location window.location 用于窗口或框架的 Location 对象。

Navigator window.navigator 对Navigator对象的只读引用

Screen window.screen 对Screen对象的只读引用

Array window.frames 返回窗口中所有命名的框架的集合。

Navigator 对象是由 浏览器中的脚本运行时引擎自动创建的，包含有关客户机浏览器的信息。

appCodeName 返回浏览器的代码名。

appName 返回浏览器的名称。

appVersion 返回浏览器的平台和版本信息。

cookieEnabled 返回指明浏览器中是否启用 cookie 的布尔值。

platform 返回运行浏览器的操作系统平台。

userAgent 返回由客户机发送服务器的 user-agent 头部的值。

测试Navigator的属性值

1
2
3
4
5
6
7
8
9
10
11
12
document.write("navigator.appCodeName浏览器代码名:" + navigator.appCodeName);
document.write('<hr>');
document.write("navigator.appName浏览器名:" + navigator.appName);
document.write('<hr>');
document.write("navigator.appVersion返回浏览器平台和版本信息:" + navigator.appVersion);
document.write('<hr>');
document.write("navigator.cookieEnabled  Cookie是否启用:" + navigator.cookieEnabled);
document.write('<hr>');
document.write("navigator.platform 返回运行浏览器的操作平台:" + navigator.platform);
document.write('<hr>');
document.write("navigator.userAgent 返回由客户机发送服务器的 user-agent 头部的值:" + navigator.userAgent);
document.write('<hr>');

使用userAgent判断使用的是什么浏览器(假设使用的是IE8浏览器),代码如下:

1
2
3
4
5
6
7
8
9
10
11
12
13
function validB(){
  var u_agent = navigator.userAgent;
  var B_name="Failed to identify the browser";
  if(u_agent.indexOf("Firefox")>-1){
      B_name="Firefox";
  }else if(u_agent.indexOf("Chrome")>-1){
      B_name="Chrome";
  }else if(u_agent.indexOf("MSIE")>-1&&u_agent.indexOf("Trident")>-1){
      B_name="IE(8-10)";
  }
    document.write("B_name:"+B_name+"<br>");
    document.write("u_agent:"+u_agent+"<br>");
}

Screen对象

Screen对象 是由浏览器中的脚本运行时引擎自动创建的，包含有关客户机显示屏幕的信息。每个 Window 对象的 screen 属性都引用一个 Screen 对象。Screen 对象中存放着有关显示浏览器屏幕的信息。

Screen对象的属性

availHeight 返回显示屏幕的高度 (除 Windows 任务栏之外)。

availWidth 返回显示屏幕的宽度 (除 Windows 任务栏之外)。

colorDepth 返回目标设备或缓冲器上的调色板的比特深度。

height 返回显示屏幕的高度。

width 返回显示器屏幕的宽度。

1
2
3
4
5
6
7
8
document.write("Screen resolution: ");
document.write(screen.width + "*" + screen.height);
document.write("<br />");
document.write("Available view area: ");
document.write(screen.availWidth + "*" + screen.availHeight);
document.write("<br />");
document.write("Color depth: ");
document.write(screen.colorDepth);

浏览器对象模型是指脚本的运行环境即浏览器为脚本提供的一组对象以及这组对象之间的组织关系。

Window对象实现有关浏览器窗口的操作及对框架的访问。

Location对象提供有关页面地址的信息和对地址的操作方法。

History对象用于表示浏览器窗口曾经访问过的页面的地址的集合，包含一些方法实现在这一系列的地址内前进后退或跳转。

Navigator对象用于获取浏览器所在的客户端的信息。

Screen对象用于获取客户机屏幕的信息。