DOM&BOM-day05BOM概述，window顶级对象1.BOM基本描述：BOM浏览器对象模型，是一套用来管理控制浏览器的规则
1.DOM与BOM比较相似，都是管理抽象对象的规则
2.BOM主要负责页面与页面的通讯
3.BOM的核心对象是window，通常BOM一般指的是window对象
4.BOM是对浏览器进行管理的规则，因此没有统一二点标准
BOM与DOM之间的关系：
DOM通过document对象来访问，控制，修改html等文档中的内容
BOM通过window对象来访问，控制，修改浏览器中的内容
#通常可以说DOM是被包含在BOM中的，可以通过js操作来访问浏览器，通过执行浏览器的DOM来获取文档的内容
#区别：
#DOM描述了处理网页内容的方法和接口，操作页面内部
#BOM描述了与浏览器尽享交互的方法和接口，操作页面之间
#全局对象都是挂载在window上2.页面加载事件区别 :
onliad:dom,静态资源（css/图片）都加载完毕后在执行function里面的代码
DOMContentLoaded：dom节点加载完毕后，不包括css，图片或者其他的静态资源
加载速度比onload更快调整窗口大小事件：onresize
响应式布局---重绘3.定时器定时器是window下的，可以省略前缀window. 3.1分类周期定时器---一直执行下去
setInterval(回调函数,执行时间);
//window.setInterval(回调函数,执行时间);
//可省略window
延迟定时器---只执行一次
setTimeout(回调函数,执行时间);
//window.setTimeout(回调函数,执行时间);
//可省略window
执行时间单位都是毫秒----1000ms=1s3.2清除定时器直接清除清除周期定时器
clearInterval(定时器名字);
//window.clearInterval(timerId1);
//可省略window
清除延迟定时器
clearTimeout();
//window.clearTimeout(timerId3);
//可省略window条件清除//运行一次清除
let timerId1 = setTimeout(function () {
console.log('setTimeout');
clearTimeout(timerId1);
}, 2000);
//达到条件清除
let num = 0;
let timerId2 = setInterval(function () {
num++;
console.log(num);
//10s后不再进行
if (num == 10) {
clearInterval(timerId2);
}
}, 1000)4.JS同步和异步同步：
按照默认书写顺序，从上到下，从左到右，依次执行
#同步错误影响整个代码执行
异步：
异步代码遇到同步代码，先执行同步代码，后执行异步代码
执行顺序：先触发条件执行
#异步错误不影响同步执行js中三种异步的情况 1.事件
2.定时器
3.ajax5.location对象location对象，提供了当前窗口中加载文档的信息，以及通常的导航功能，主要对浏览器url地址相关数据的获取和定义 //文档加载所有的信息
window.location;
//参数
location.search;
//herf---完整的url地址
location.href;
//hash---哈希
location.hash;
//port---端口号
location.port;
//host---页面的域名以及端口号
location.host;
//hostname---页面的域名
location.hostname;
//pathname---页面中的路径或文件名
location.pathname;
//origin---返回的是url原地址---协议/域名/端口号
location.origin;location方法
// 重新加载---刷新
location.reload();模拟a标签
#运用location，href属性模拟a标签点击事件
<!-- <a href="https://www.baidu.com/">去百度</a> -->
<div>div</div>
<p>这是段落，我要去百度</p>
<script>
// 获取dom节点
const box = document.querySelector('div');
box.addEventListener('click', function () {
window.location.href = "https://www.baidu.com/";
})
const p = document.querySelector('p');
p.addEventListener('click', function () {
window.location.href = "https://www.baidu.com/";
})
</script>
| 
