BOM(Browser Object Model): 浏览器对象模型。提供了独立于内容而与浏览器窗口交互的对象,BOM主要用于管理窗口和窗口之间的通讯。

一、Navigator对象

     navigator对象通常用于获取浏览器和操作系统的信息。
     navigator对象是window对象的属性,中文是"导航器"的意思。
     由于navigator没有统一的标准,因此各个浏览器都有自己不同的navigator版本,这里只介绍最普遍支持且最常用的。

    

     navigator中最重要的是userAgent属性,返回包含浏览器版本等信息的字符串,其次cookieEnabled也很重要,使用它可以判断用户浏览器是否开启cookie。

    		document.write(
"浏览器信息:<br>"+
"名称:"+navigator.appName+"<br>"+
"平台和版本:"+navigator.appVersion+"<br>"+
"操作系统:"+navigator.platform+"<br>"+
"userAgent:"+navigator.userAgent
);

结果:

     

 

二、History对象

     window.history 对象包含浏览器的历史。浏览者通常可以使用浏览器的前进与后退按钮访问曾经浏览过的页面。JavaScript的history对象记录了用户曾经浏览过的页面,并可以实现浏览器前进与后退相似的导航功能。可以通过back函数后退一个页面,forward函数前进一个页面,或者使用go函数任意后退或前进页面,还可以通过length属性查看history对象中存储的页面数。

      

     对于 go() 方法的说明。

     语法:

         history.go(x);

     其中,x (整数)为前进或后退的页面数。

         x > 0: 前进 x 个页面;

         x < 0: 后退 -x 个页面;

         x = 0: 刷新当前页面。

<html>
<head> <title>My JSP 'index.jsp' starting page</title>
<script type="text/javascript" charset="UTf-8"> function test1(){
//返回上一个网页
history.back();
} function test2(){
//前进一页
history.forward();
} function test3(){
//刷新当前页面
history.go(0);
} </script> </head>
<body> <input type="button" onclick="test1();" value="返回上一个网页"><br><br>
<input type="button" onclick="test2();" value="跳转到下一个页面"><br><br>
<input type="button" onclick="test3();" value="刷新当前页面"><br><br> </body>
</html>

 

三、Location对象

     window.location 对象用来获取当前页面的地址 (URL)信息,并可将浏览器重定向到其他页面。

    

    	function locationTest(){
var str = location.href;
alert(str); // http://localhost:8080/Day01_JS/index.jsp
//发生请求跳转到其他页面
location.href = "http://www.baidu.com";
}

 

四、Screen对象

     window.screen 对象用来获取用户屏幕的信息。

    

    	function alertTest(){
alert(
"屏幕信息:\n"+
"分辨率:"+screen.width+"×"+screen.height+"\n"+
"可用区域:"+screen.availWidth+"×"+screen.availHeight
);
}

结果:

      屏幕信息:

      分辨率:1366×768

      可用区域:1366×728

 

五、Window对象

未完待续

JavaScript基础学习(七)—BOM的更多相关文章

  1. JavaScript 基础学习1-day14

    JavaScript 基础学习1 知识预览JavaScript概述二 JavaScript的基础三 JavaScript的对象BOM对象DOM对象实例练习js扩展 JavaScript概述 JavaS ...

  2. 48.javascript基础学习

    javascript基础学习:   http://www.w3school.com.cn/jsref/index.asp jS的引入方式: 1.行间事件:为某一个具体的元素标签赋予js内容,oncli ...

  3. JavaScript 基础学习(二)js 和 html 的结合方式

    第一种 使用一个标签 <script type="text/javascript"> js代码; </script> 第二种 使用 script 标签,引入 ...

  4. JavaScript 基础 学习 (四)

    JavaScript 基础 学习 (四) 解绑事件 dom级 事件解绑 ​ 元素.on事件类型 = null ​ 因为赋值的关系,所以给事件赋值为 null 的时候 ​ 事件触发的时候,就没有事件处理 ...

  5. JavaScript 基础 学习(三)

    JavaScript 基础 学习(三) 事件三要素 ​ 1.事件源: 绑定在谁身上的事件(和谁约定好) ​ 2.事件类型: 绑定一个什么事件 ​ 3.事件处理函数: 当行为发生的时候,要执行哪一个函数 ...

  6. JavaScript 基础 学习 (二)

    JavaScript 基础 学习 节点属性 ​ 每一个节点都有自己的特点 ​ 这个节点属性就记录着属于自己节点的特点 1. nodeType(以一个数字来表示这个节点类型) ​ 语法:节点.nodeT ...

  7. JavaScript 基础 学习 (一)

    JavaScript 基础 学习 获取页面中的元素的方法 作用:通过各种方式获取页面中的元素 ​ 比如:id,类名,标签名,选择器 的方式来获取元素 ​ 伪数组: ​ 长的和数组差不多,也是按照索引排 ...

  8. 几张非常有意义的JavaScript基础学习思维图

    分享几张对于学习JavaScript基础知识非常有意义的图,无论你的JavaScript级别如何,“温故而知新”完全可以从这些图中得到. 推荐理由:归类非常好,非常全面 JavaScript 数组 J ...

  9. javascript基础学习(七)

    javascript之Object对象 学习要点: 创建Object对象 Object对象属性 Object对象方法 一.创建Object对象 new Object(); new Object(val ...

随机推荐

  1. ThinkPHP5.0学习1 — 命名空间

    定义命名空间:namespace sp1: 访问命名空间:\sp1\somefunction(); 非限定名称访问方式     //访问当前命名空间内容:somefunction(); 限定名称访问方 ...

  2. 【CNMP系列】CentOS7.0下安装MySql5.6服务

    接上一回的话,CentOS7.0下安装好了Nginx服务,对于我们的CNMP,我们可以开始我们的M啦,就是传统意义上的MySql服务 MySql简介 MySQL是一个关系型数据库管理系统,由瑞典MyS ...

  3. MySQL备份说明

    第一次发布博客,发现目录居然不会生成,后续慢慢熟悉博客园的设置.回正文--- 1 使用规范 1.1 实例级备份恢复 使用innobackupex,在业务空闲期执行,考虑到IO影响及 FLUSH TAB ...

  4. H5缓存-Manifest

    在app中更新h5页面一直有缓存问题.默认什么都不做的情况下,app有一定的空间缓存页面.一开始更新之后会马上加载,等到app缓存空间上来之后更新就无法下载了.安卓能够清理缓存空间,ios就只能卸载重 ...

  5. 存储可靠性技术之 --RAID

    云计算项目交付时,不可避免的需要考虑存储磁盘采用何种RAID.例如:我们的项目工程师可能会建议大家连接克隆虚拟机系统盘组RAID 10,完整复制虚拟机数据盘 使用RAID5或者RAID6等,那么RAI ...

  6. Java代理(静态/动态 JDK,cglib)

    Java的代理模式是应用非常广泛的设计模式之一,也叫作委托模式,其目的就是为其他的对象提供一个代理以控制对某个对象的访问和使用,代理类负责为委托类预处理消息,过滤消息并转发消息,以及对消息执行后续处理 ...

  7. 好公司、行业、领导?应届生应根据什么选offer?

    两个年轻人大学毕业了,一个去了收入更高的大企业工作,一个去了收入较低的小作坊式工厂工作.你们说他们谁的青春时光最能升值呢?表面上看应该是大企业,可是大企业是做马车制造的,小作坊是做汽车的.现在人们都知 ...

  8. php 实现购物车功能,以大苹果购物网为例,上图上代码。。。。

    首先是几个简单的登录页面 <body> <form action="chuli.php" method="post"> <div ...

  9. [HDU]1016 DFS入门题

    题目的意思就是在1到n的所有序列之间,找出所有相邻的数相加是素数的序列.Ps:题目是环,所以头和尾也要算哦~ 典型的dfs,然后剪枝. 这题目有意思的就是用java跑回在tle的边缘,第一次提交就tl ...

  10. wemall app商城源码Android 获取XML网络数据并绑定到ListView

    wemall-mobile是基于WeMall的android app商城,只需要在原商城目录下上传接口文件即可完成服务端的配置,客户端可定制修改.本文分享Android 获取XML网络数据并绑定到Li ...