0
点赞
收藏
分享

微信扫一扫

JS BOM

凯约 2022-03-21 阅读 60
1.BOM

​ BOM,Browser Object Model,即浏览器对象模型。

​ 1.window对象包含了核心对象

location,即当前页面的地址
history,即页面的历史记录
navigator,包含浏览器相关信息
screen,用户显示屏幕相关属性
screen,用户显示屏幕相关属性
2.窗口对象(window)

​ 1.常用方法

prompt()显示可提示用户输入的对话框
alert( )显示带有一个提示信息和一个确定按钮的警示框
confirm( )显示一个带有提示信息、确定和取消按钮的对话框
close( )关闭浏览器窗口
open()打开一个新的浏览器窗口,加载给定URL所指定的文档
setTimeout( )在指定的毫秒数后调用函数或计算表达式
setInterval( )按照指定的周期(以毫秒计)来调用函数或表达式

​ 2.定时器

setTimeout()和clearTimeout()var timerId = setTimeout(function () {
console.log('倒计时定时器')
},1000)
clearTimeout(timerId)
在JavaScript中,我们可以使用setTimeout()方法来设置“一次性”调用的函数。其中clearTimeout()可以用来取消执行setTimeout()方法。
setInterval()和clearInterval()var timerId2 = setInterval(function () {
    console.log("间隔定时器’)
},1000)
coearInterval(timerId2)
在JavaScript中,我们可以使用setInterval()方法来设置“重复性”调用的函数。其中clearInterval()可以用来取消执行setTimeout()方法。

3.对话框

alert() 消息提示框
confirm() 消息确认框
prompt()

4.获取浏览器窗口的尺寸

innerHeight和innerwidth这两个方法分别是用来获取浏览器窗口的宽度和高度(包含滚动条的)
var windowHeight = window.innerHeight
console.log(windowHeight)
var windowwidth = window.innerwidth
console.log(windowwidth)

5.浏览器的onsrcoll事件

onscroll事件是当浏览器的滚动条滚动的时候触发
或者鼠标滚轮滚动的时候触发
window.onscroll = function(){
console.log('浏览器滚动了')
}
注意∶前提是页面的高度要超过浏览器的可是窗口才可以

5.浏览器滚动的距离

 scrollTop  获取的是页面向上滚动的距离
scrollLeft 获取页面向左滚动的距离
3.历史记录对象(history)

back()加载history对象列表中的前一个URL
forward()加载history对象列表中的下一个URL
go()加载history对象列表中的某个具体URL

history.back()=history.go(-1)
浏览器中的“后退”

history.forward()=history.go(1)
浏览器中的“前进”

4.位置对象(location)

1.常用属性

location.href
获得当前页面的URL地址:location.href (window.location.href)

2.常用方法

重新加载当前文档:location.reload();

3.属性


-hash    " #contents"    返回URL中的hash(#号后跟零或多个字符),如果URL中不包含散列,则返回空字符串
-host	"www. wrox.com : 80"	返回服务器名称和端口号(如果有)
-hostname	" www.wrox.com"		返回不带端口号的服务器名称
-href	"http :/ www . wrox.com"	返回当前加载页面的完整URL。而location对象的tostring()方法也返回这个值
-pathname	"/wileyCDA/"	返回URL中的目录和(或)文件名
-port	"8080"	返回URL中指定的端口号。如果URL中不包含端口号,则这个属性返回空字符串
-protocol	" http : "	返回页面使用的协议。通常是http:或https:
-search	" ?q=javascript"返回URL的查询字符串。这个字符串以问号开头

举报

相关推荐

JS-BOM

js-bom

JS-BoM

JS_8BOM

JS--BoM案例演示

0 条评论