1.什么是BOM?
DOM就是一套操作HTML标签的API(接口/方法/属性);
BOM就是一套操作浏览器的API(接口/方法/属性);
2.BOM中常见的对象
window: 代表整个浏览器窗口
注意: window是BOM中的一个对象, 并且是一个顶级的对象(全局);
Navigator: 代表当前浏览器的信息, 通过Navigator我们就能判断用户当前是什么浏览器;
var agent = window.navigator.userAgent;
if(/chrome/i.test(agent)){
alert("当前为谷歌浏览器");
}
Location: 代表浏览器地址栏的信息, 通过Location我们就能设置或者获取当前地址信息;
// 获取当前地址栏的地址
oBtn1.onclick = function(){
console.log(window.location.href);
}
// 设置当前地址栏的地址
oBtn2.onclick = function(){
window.location.href = "http://www.it666.com";
}
// 重新加载界面
oBtn3.onclick = function(){
window.location.reload();
}
oBtn4.onclick = function(){
window.location.reload(true); //强制刷新,会更新缓存
}
History: 代表浏览器的历史信息, 通过History来实现刷新/上一步/下一步;
注意点: 出于隐私考虑, 我们并不能拿到用户所有的历史记录, 只能拿到当前的历史记录;
注意点:
只有当前访问过其它的界面, 才能通过forward/go方法前进;
如果给go方法传递1, 就代表前进1个界面, 传递2就代表进行2个界面;
oBtn1.onclick = function () {
// window.history.forward();
window.history.go(1);
}
// 刷新
// 如果给go方法传递0, 就代表刷新
oBtn2.onclick = function () {
window.history.go(0);
}
注意点:
只有当前访问过其它的界面, back/go方法后退;
如果给go方法传递-1, 就代表后退1个界面, 传递-2就代表后退2个界面;
oBtn1.onclick = function () {
// window.history.back();
window.history.go(-1);
}
Screen: 代表用户的屏幕信息
-End