BOM对象常用方法总结

BOM是什么？

首先BOM全称为浏览器对象模型（BOM）。是用来获取浏览器相关信息的对象，并且可以操纵浏览器

Window

window对象是js中最大的对象，所有的对象都在这个对象中存在。在ES6之前，我们创建的变量会变成window对象的属性，创建的函数，会变成window对象的方法。我们在调用window对象的相关属性和方法时，可以不写window.

location

location包含了浏览器访问的网址的所有信息。网页url的改变会改变location获取到的信息。

一般我们会在url中修改的内容就是search和hash

基础知识

 

 

方法总结

• hash 表示url中”#“后跟着的的内容 hash内容不管怎么改变，访问的网页是不变
• host 域名 和 hostname 一致
• hostname
• href 当前网页的url
• origin 只包含协议和域名
• pathname 路径
• port 端口
• protocol 协议
• search ?后面的参数

location常用方法

href 页面跳转

不用js也可以实现页面的跳转操作但是js跳转更灵活，比如在历史记录中新增一条历史记录

location.href = "url"
location.assign("url")

reload 重载

重新加载（刷新）

location.reload()
// 或者
location.href = location.href

replace 替换

跳转页面，替换当前的历史纪录

location.replace(url)

history

历史记录，每当一个页面访问，就会在历史记录中新增一条新的历史记录。通过对历史记录的操作，我们可以在历史记录中进行跳转。

back 返回上一页

在历史记录中返回上一页，前提是上一页得有记录

history.back() 

forward 进入下一页

在历史记录中前进下一页，前提是下一页得有记录

history.forward() 

go 根据值跳转

在go（）中写数字，正值表示向下一页跳转，负值是上一页，数字写几，就跳转几页

history.go(1)    //下一页 
history.go(-1)    //上一页 
history.go(0)    //刷新页面。

新增方法

在HTML5中对于historyApi中新增了pushState和replaceState，不跳转页面，然后在历史记录中新增一个历史记录

pushState

在历史记录中新增一个假的历史记录，可以达到改变url，但是页面不跳转的目的。来模拟历史记录的操作

replaceState

替换掉当前的历史记录，他不会进行实际页面的跳转，只会改变url