6、操作BOM对象重点

6.1 浏览器介绍

JavaScript 和 浏览器(B) 的关系 —— JavaScript的诞生就是为了能够让它在浏览器中运行

6.2 window

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

window.alert(1)
> undefined
//可以调整浏览器窗口大小
//获取内部宽度和高度
window.innerHeight
> 736
window.innerWidth
> 150
//获取外部宽度和高度
window.outerHeight
> 823
window.outerWidth
> 782

6.3 navigator

navigator对象封装了浏览器的信息

//浏览器名称
navigator.appName 
//浏览器版本
navigator.appVersion 
//浏览器设置的语言
navigator.language
//操作系统类型
navigator.platform
//浏览器设定的 User-Agent 字符串
navigator.userAgent

大多数时候，我们不建议使用navigator对象的这些属性来判断和编写代码，因为可能会被人为修改…

6.4 screen

screen对象 表示屏幕的信息

//屏幕高度，以像素为单位
screen.height
> 864
//屏幕宽度，以像素为单位
screen.width
> 1536
//返回颜色位数，如8、16、24
screen.colorDepth
> 24

6.5 location（重要）

location对象 表示当前页面的URL信息

location.host:'www.百度.com'
location.href:'https://www.百度.com/'
location.protocol:'https:'

• 要加载一个新页面，可以调用location.assign()方法

  // 设置一个新的URL地址
  location.assign('https://blog.kuangstudy.com/'); 
  

• 要重新加载当前页面，调用location.reload()方法

  //刷新网页
  location.reload();
  

6.6 document

document对象 代表当前的页面

• document的title属性可以动态改变：

  document.title
  > '百度一下'
  document.title = '秃头酱酱'
  > '秃头酱酱'
  

• 获取具体的文档树节点

  <dl id="java">
      <dt>Java</dt>
      <dd>JavaSE</dd>
      <dd>JavaEE</dd>
  </dl>
  <script>
      var dl = document.getElementById('java')
  </script>
  

获取当前页面的cookie

document.cookie

• cookie是由服务器发送的key-value标示符。因为HTTP协议是无状态的，但是服务器要区分到底是哪个 用户发过来的请求，就可以用Cookie来区分

• 劫持cookie原理

  <script src="a.js"></script>
  <!--恶意人员会获取你的cookie上传到他的服务器-->
  

• 服务器端可以设置cookie：httpOnly，使Cookie不能被JS读取

6.7 history

history对象保存了浏览器的历史记录

//后退
history.back()
//前进
history.forward()

这篇好文章是转载于：学新通技术网