bom全名浏览器对象模型(browser object model
)。是用javascript与浏览器交互的一种方式。
bom没有官方标准。
各个浏览器都有自己的实现标准,可能会出现兼容性问题。
1. location
location
对象包含有关当前url的信息。可以查看地址url信息。
通过location
可以对元素设置herf
,实现页面跳转
console.log(loaction)
运行截图:
常用的location
属性为herf
、passname
herf
可以返回或者设置url地址
div.onclick(){
location.herf="https://www.baidu.com"
}
当我们的location
设置herf
属性为本网页地址的时候可以实现简单的页面刷新
location.herf = location.herf;
2. location.reload()
当我们需要完成页面刷新的需求的时候,可以用location.reload()
div.onclick = function(){
location.reload();
}
3. history
history
对象包含用户访问过的url。
history.forword()//下一个网页
history.backword()//上一个w网页
history.go(num) //负数为上一个,上一个的上一个,正数为下一个
4.navigator
navigator
对象包含有关浏览器的信息。
可以返回浏览器信息,但是兼容性很差。
console.log(navigato)r
这里面有用的信息为useragent,这里面为用户的信息。可以返回浏览器用户信息。所有的浏览器都有
5. screen
screen
对象包含了有关客户端显示屏幕的信息。
不一样的浏览器,screen的返回值不一样,这是兼容性问题。
height:电脑显示器的height;
width:电脑显示器的width;
availheight:除了信息栏的高度
availwidth:除了信息栏的宽度
浏览器距离屏幕的距离:
screenx:浏览器到屏幕左侧的距离
screenleft:浏览器到屏幕左侧的距离
screentop:浏览器到屏幕顶部的距离
screeny:浏览器到屏幕顶部的距离
<注意>
没有screenright和screenbottom
6.innerhight/innerwidth
用于查看窗口的内部大小。
innerheight:用于查看窗口的内部高度
innerwidth:用于查看窗口的内部宽度
7.outerheight/outerwidth
用于查看窗口的外部大小。
innerheight:用于查看窗口的外部高度
innerwidth:用于查看窗口的外部宽度