<Js知识点梳理>---BOM篇

323 阅读2分钟

BOM

Q:什么是BOM?
A:Browser Object Model ,浏览器对象模型,主要功能是提供js与浏览器的交互功能

window对象

window是js的顶级对象,所有定义在全局的变量和函数最终都会成为window的属性和方法,调用时可以省略window

变量和函数

var test="name";    #声明一个全局变量
console.log(test);  //输出结果:name
console.log(window.test);   //输出结果:name
function name(){    
    console.log(web);   //定义一个函数   
}
name(); //输出结果:web   
window.name();  //输出结果:web

页面弹窗

浏览器通过 alert()、confirm() 和 prompt() 方法可以调用系统对话框向用户显示消息。它们的外观由操作系统及(或)浏览器设置决定,而不是由 CSS 决定。此外,通过这几个方法打开的对话框都是同步和模态的。也就是说,显示这些对话框的时候代码会停止执行,而关掉这些对话框后代码又会恢复执行。

window.alert("hello") //单纯的弹窗

var result = window.confirm("hello") //弹窗时能接受返回值true or false
console.log(result)

var result = window.prompt("hello") //弹窗时能接受用户输入
console.log(result)

location对象

location的属性

可以直接调用location打印所包含的方法,常用方法和属性如下:

host: "juejin.im" //返回服务器名称以及端口号(如果有)
hostname: "juejin.im"   //返回服务器名称
href: "https://juejin.im/search?query=xxx"  //返回完整url
origin: "https://www.cnblogs.com"   
pathname: "/2010master/p/5824215.html"
port: "" //返回端口(如果有)

location.reload("true") //刷新页面 true代表无缓存刷新

navigator对象

可以直接调用navigator打印所包含的方法,常用方法和属性如下:

navigator.userAgent //浏览器信息
navigator.platform  //系统平台

history对象

history.length //历史记录长度
history.forward()   //前进一步
history.back()  //后退一步
history.go()    //根据参数实现任意跳转,也就是说history.go(1) 等同于 history.forward()