BOM

JS的组成：

1. ECMAScript --> es5
2. DOM --> document object model 文档对象模型
3. BOM --> browser object model 浏览器对象模型

什么是BOM？？？ ==> Broswer Object Model

BOM和DOM类似也是一个编程接口,这个编程接口让JavaScript有能力与浏览器对话(可以操作浏览器)
和DOM不同的是,DOM的核心是document,而BOM的核心是window。
在全局环境中的变量&&函数声明自动成为window的属性和值

window.location

window.location 浏览器地址栏信息

console.log(window.location);

当人然他是一个大对象，有属性名和属性值组成的一个对象

那么window上面的属性可以不写，window吗？？

验证

console.log(window.location===location);

是可以不写window，因为全局对象上面的属性默认是window，可以直接把window给干掉，直接写对应的属性名字

location.href 存储地址栏的完整信息

console.log(location.href);

那么可以修改location.href 属性吗？？？

location.href = "http://www.baidu.com";

是可以的，location.href 是可读也可写的，读是获取地址栏的详细信息，写是给当前的location.href 赋值那么会跳转到当前的地址网页中

location.href 存储地址栏的完整信息（可读 可写）

location.pathname 存储的是端口后面的字符串

console.log(location.pathname);

location.hash 存储的是hash值 #后面的字符串

#号后面加上一波字符串表示点前的hash值

console.log(location.hash);

location.search 存储的是查询字符串 ?后面的字符串

console.log(location.search)

.search是查询字符串，？号后面的一波字符串表示当前这条中的地址栏查询字符串

location.protocol 存储的是地址栏的协议

console.log(location.protocol)

https后面使用的数据都依靠https这个前缀的

location.port 存储的是地址栏的端口

console.log(location.port);

location.hostname 存储的是地址栏的域名(主机名)

console.log(location.hostname);

location.host 存储的是域名+端口号

console.log(location.host);

history

history 某窗口的历史页面

console.log(window.history)

他是个对象，花括号开始花括号结束，属性名和属性值，也是在使用的时候也可以不写widow 他会自动在window属性上的

history.length存储了当前窗口的历史页面的个数

console.log(history.length);

当前打开两个历史页面

historyback() 倒退一个历史页面

console.log(history.back());

往前倒退了一张历史页面

history.forward() 跳转到后一个页面

console.log(history.forward);

跳转到后一个页面了

history.go(n) 向前前进n张页面 、n可以取负值(表示倒退)

console.log(history.go(1))

往后前进了一张历史页面

navigator

navigator ==>浏览器的信息

他也是花括号开始花括号结束的并且有属性名和属性值的一个对象

appVersion表示当前谷歌浏览器所在的版本

userAgent是用户代理是存储当前浏览器的版本信息的

window对象的方法

alert() 弹出一个窗口，无返回值

alert(10)

那么填一个对象进里，他会弹出什么？？

  alert({name:"banner"});

说明他把这个对象隐式转换成字符串并且弹出

他会偷偷地调用toString方法然后在弹出返回结果

alert(['banner',25]);

会把数组变成字符串然后弹出

结论

alert(数据)

1. 调用数据的toString方法
2. 弹出数据的字符串形式

confirm()弹出一个窗口的同时，增加了两个选择按钮，返回值为布尔值

confirm('你是男的吗？？？');

无线弹窗

var result = confirm('你确定吗？？？');
      while (!result) {
      	result = confirm('你确定吗？？？');
      }

结论

confirm(问题)

• 如果点击 确定 则confirm函数返回的是true
• 如果点击 取消 则confirm函数返回的是false

prompt()在confirm的基础上，增加了输入框供用户输入内容，返回值为用户输入的内容

prompt('请输入你的名字');

结论

prompt(要求)

• 在confirm的基础上 增加输入框
• 如果点击 确定 则prompt函数返回的是 用户输入的数据
• 如果点击 取消 则prompt函数返回的是null

open(‘新页面’,’打开方式’)

window.open("https://www.jd.com");

在打开一个窗口的新的页面

那该怎么在原来的页面在打开一个页面呢？？

那就是widow.open()的第二个参数，是指用什么方式条转页面

window.open('https://www.jd.com',"_self")

第二个参数就相当于的target属性: 规定在何处打开链接一样的作用，a标签的链接方式
总结

window.open(地址，打开方式)

• 打开方式 _blank 默认值(跳转到另一个窗口页面中)
• _self 在当前页面打开

window.close() 关闭通过open函数打开的页面

window.close()//无参数