前端-JS之BOM常用API

379 阅读3分钟

一、BOM对象结构图

bom结构图.jpg

二、BOM三个常用的弹出框

特点: 阻塞代码执行

alert("内容")

作用: 消息弹出框

confirm("提示信息")

作用: 确认弹出框( 确定返回true 取消返回false

prompt("提示信息","默认值")

作用: 输入框( 返回数值为字符串

三、BOM的两个定时器

setInterval ( function,time )

作用: 连续执行定时器

参数: 参数1:要执行的任务函数,参数2:循环周期(毫秒)

clearInterval( 被清除定时器的标识id )

作用: 清除连续定时器

setTimeout( function, time )     

作用: 延时定时器(只执行一次)

参数: 参数1:要执行的任务函数,参数2:延时时间(毫秒)

clearTimeout( 被清除的id )                

作用: 清除延时定时器

四、Document对象

作用: Document对象详解请查看DMO文章中的介绍。

注意: Document 对象是 Window 对象的一部分,所以Document对象既属于BOM也属于DOM。

五、window对象

理解: window对象是一个全局对象,声明的所有的全局变量、全局方法函数都是window对象的属性或者方法。

window.open( )

作用: 打开一个新的浏览器窗口

参数: 接受四个可选参数(URL,打开方式,窗口参数,是否取代当前页面历史记录的布尔值)。

window.close( )

作用: 关闭新打开的窗口( 仅限open()打开的窗口 )。

window.moveTo( )

作用: 移动当前窗口

window.resizeTo( )

作用: 调整当前窗口的尺寸

六、location对象

理解: Location对象包含有关当前 URL 的信息。

特点: Location对象是 window 对象的一部分,可通过 window.location.xxx 对相关属性进行访问。

location.href

作用: 返回当前页面完整的URL ,修改这个属性,即跳转新页面

location.hash

作用: 返回一个URL的锚部分( URL中“#”及其后面一部分组成)

location.host

作用: 返回一个URL的主机名和端口号

location.port

作用: 返回服务器端口号

location.pathname

作用: 返回的URL路径名

location.hostname

作用: 返回的URL路径名

location.protocol

作用: 返回页面使用的URL协议

location.search

作用: 返回URL的查询部分,以问号开头

七、history对象

理解: History 对象包含用户(在浏览器窗口中)访问过的 URL,将其存储为一个history列表。

特点: History 对象是 window 对象的一部分,可通过 window.history 属性对其进行访问。

history.back()

作用: 回退到上一个URL( 与在浏览器点击后退按钮相同 )

history.forward()

作用: 跳转到下一个URL( 与在浏览器中点击按钮向前相同 )

history.go( 参数 )

作用: 参数如果是 1 前进一个页面,如果是 -1 后退一个页面,如果是 N 则前进或后退 N 个页面

history.length( )

作用: 保存历史记录的数量

八、navigator对象

理解: Navigator 对象包含有关浏览器的信息。

window.navigator.userAgent

作用: 返回用户浏览器的类型

window.navigator.platform

作用: 返回浏览器运行的操作系统平台

window.navigator.online

作用: 判断是否联网

window.navigator.appName

作用: 返回浏览器的名称

window.navigator.appVersion

作用: 返回浏览器的平台和版本信息

九、screen对象

理解: Screen 对象包含客户端显示设备的信息。

availHeight

作用: 返回屏幕的高度(不包括Windows任务栏)

availWidth

作用: 返回屏幕的宽度(不包括Windows任务栏)

colorDepth

作用: 返回目标设备或缓冲器上的调色板的比特深度

height

作用: 返回屏幕的总高度

pixelDepth

作用: 返回屏幕的颜色分辨率(每象素的位数)

width

作用: 返回屏幕的总宽度

结尾.jpg