Navigator：代表当前浏览器的信息，通过Navigator我们就能判断用户当前是什么浏览器
var agent = window.navigator.userAgent;
if (/chrome/i.test(agent)) {
alert("当前是谷歌浏览器");
} else if (/firefox/i.text(agent)) {
alert("当前是火狐浏览器");
} else if (/msie/i.text(agent)) {
alert("当前是低级IE浏览器");
} else if ("ActiveXObject" in window) {
alert("当前是高级IE浏览器");
}
Location：代表浏览器地址栏的信息，通过Location我们就能设置或者获取当前地址信息
let oBtn1 = document.querySelector("#btn1");
let oBtn2 = document.querySelector("#btn2");
let oBtn3 = document.querySelector("#btn3");
let oBtn4 = document.querySelector("#btn4");
// 获取当前地址栏的地址
oBtn1.onclick = function () {
console.log(window.location.href)
}
// 设置当前地址栏的地址
oBtn2.onclick = function () {
window.location.href = "http://www.w3school.com";
}
// 重新加载界面
oBtn3.onclick = function () {
// 默认刷新不一定会更新缓存
window.location.reload();
}
oBtn4.onclick = function () {
// 强制刷新会更新缓存
window.location.reload(true);
}
History：代表浏览器的历史信息，通过History来实现刷新/前进/后退
注意点：出于隐私考虑，我们并不能拿到用户所有的历史记录，只能拿到当前的历史记录
let oBtn1 = document.querySelector("#btn1");
let oBtn2 = document.querySelector("#btn2");
let oBtn3 = document.querySelector("#btn3");
// 前进
oBtn1.onclick = function () {
// window.history.forward();
window.history.go(1);
}
// 后退
oBtn2.onclick = function () {
// window.history.back();
window.history.go(-1);
}
// 刷新
oBtn3.onclick = function () {
window.history.go(0);
}
history对象的go方法带一个整型参数。
当参数为正值，代表前进几个界面
当参数为负值，代表后退几个界面
当参数为0，代表刷新
