一、浏览器历史记录有关系的内容 window.history
1.历史记录的回退 window.history.back();
// 1.历史回退 ，回退上一个历史记录页面: 回退到上一个页面，必须得有上一个页面的历史记录
// window.history.back
var ele = document.getElementsByTagName("button")[0];
ele.onclick = function () {
window.location.href = "./a.html";
}
2.历史记录的前进 window.history.foword();
// 2.前进到下一个历史记录页面 forward()；注意：必须要有下一个页面的历史记录
var elenext = document.getElementsByClassName("next")[0];
elenext.onclick = function () {
console.log(123);
window.history.forward();
}
3.历史记录到指定位置 window.history.go(): 前进就是整数，后退就是负数。(即可以跳转到指定的历史页面 ，也可以回退指定的历史记录页面)
// 3.go : 回退指定的历史记录页面 （必须有历史记录）;window.history.go(数字)；数字：前进就是正数，后退就是负数
var goEle = document.getElementsByClassName("goEle")[0];
goEle.onclick = function () {
window.history.go(2); //直接前进至接下来的第2层页面
}
二、浏览器事件相关
1.window.onload等到页面文档和资源加载完毕之后，自动调用onload后面的函数，并不是立即执行。
js代码放在头部和尾部的区别
2.onresize : 在浏览器被重置的时候会触发该事件
var html = document.getElementsByTagName("html")[0];
console.log(html);
html.style.fontSize = window.innerWidth/10 + "px"; //动态设置 html根字体大小
window.onresize = function () {
console.log("浏览器被大小被重置了");
}
3.onscroll ： 当页面滚动的时候会触发 ，浏览器必须能够滚动
window.onscroll=function{
console.log("页面滚动")
}
- 滚动时候页面被卷掉的距离
window.onscroll = function () {
// 获取被卷掉的高度
console.log(document.documentElement.scrollTop ); // 有文档声明
console.log(document.body.scrollTop) //没有文档声明
}
//注意： Chrome 和 火狐浏览器
// 一、如果有文档声明 那么我们通过 document.documentElement来获取;
//二、如果没有文档声明 那么我们通过document.body来获取
//IE ： 1.如果没有文档声明 两个都可以
//2. 如果有文档声明 那么document.documentElement起作用 ，document.body不起作用
//safari ： window.pageYoffset 来获取
三、弹框 特点：会阻止后面的代码执行
1.弹框 alert("弹出的内容")；
alert(123);//一进页面就执行
2.prompt : 会弹出一个输入框 ，如果点击了确定就是输入框里的内容，如果点击了取消就得到一个null的返还
var str = prompt("请输入内容");
console.log(str);//点击取消会返还null
3.confirm 询问框 ,返还值：如果点击了确定 就返还true ，如果点击了取消就返还false。
var res = confirm("确定么?");
console.log(res);
四、定时器
1-倒计时定时器setTimeout 注意只会执行一次
倒计时定时器: 执行一段时间之后执行某一段代码 ，单位是毫秒。
setTimeout(function() {
console.log("定时2秒之后会执行的代码");
}, 2000);//刷新倒计时2秒后会执行一次代码
2-间隔定时器setInterval 注意setInterval会一直在后台循环执行；
var num = 0;
setInterval(function(){
console.log("间隔2秒执行这里的代码");
// 修改页面的标题，直观反映循环的次数
num++;
document.title = num; //修改页面的标题
}, 1000);//每隔一秒循环一次
3-消除定时器(停止定时器)clearTimeout clearInterval:可以互通
4-定时器里的this，在定时器里 如果不是箭头语法 ，那么它的this是指向 window；
setInterval(function(){
console.log("setinterval",this);//this指向全局window
}, 1000)
5-定时器的执行顺序问题 ：所有定时器里的代码（异步代码）会滞后于普通的代码（同步代码）
setTimeout(function() {
console.log(111);//第三执行
}, 0);
console.log(222);//第一执行
setTimeout(function() {
console.log(333)//第四执行
});
console.log(444);//第二执行
6-settimeout 可以当成 setinterval 来使用
