1、BOM简介。 所谓的BOM即浏览器对象模型(Browser Object Model)。BOM赋予了JS操作浏览器的能力,即window操作。DOM则用于创建删除节点,操作HTML文档。BOM尚无正式的标准,导致各浏览器对于BOM方法的支持各有不同,因此需要具体问题具体对待 ...
1、BOM简介。
所谓的BOM即浏览器对象模型(Browser Object Model)。BOM赋予了JS操作浏览器的能力,即window操作。DOM则用于创建删除节点,操作HTML文档。BOM尚无正式的标准,导致各浏览器对于BOM方法的支持各有不同,因此需要具体问题具体对待。
2、window对象。
window对象是BOM的核心,window对象指当前的浏览器窗口。所有JS全局对象、函数以及变量都属于window对象。全局变量是window对象的属性。全局函数是window对象的方法。甚至DOM的document也属于window对象的属性之一,只是大多数情况下可以忽略不写。
window对象方法:
方法 | 描述 |
alert() | 弹出带有文本消息和一个确认按钮的警告框 |
prompt() | 弹出可提示用户输入的对话框 |
confirm() | 弹出带有文本消息及确认按钮和取消按钮的对话框 |
open() | 打开一个新的浏览器窗口 |
close() | 关闭浏览器窗口 |
print() | 打印当前窗口的内容 |
focus() | 把键盘焦点给予一个窗口 |
blur() | 把键盘焦点从顶层窗口移开 |
moveBy(xnum, ynum) | 相对窗口的当前坐标将对象移动指定的像素 |
moveTo(x, y) | 把窗口的左上角移动到一个指定的坐标 |
resizeBy(w, h) | 按照指定的像素调整窗口的大小 |
resizeTo(w, h) | 将窗口的大小调整到指定的宽度和高度 |
scrollBy(xnum, ynum) | 按照指定的像素值来滚动内容 |
scrollTo(x, y) | 将内容滚动到指定的坐标 |
setInterval() | 每隔指定的时间执行代码 |
setTimeout() | 在指定的延迟时间之后来执行代码 |
clearInterval() | 取消 setInterval() 的设置 |
clearTimeout() | 取消 setTimeout() 的设置 |
3、窗口操作。
(1)、打开窗口。
open() 方法可用于打开新窗口。
语法:window.open(url, name/target, 窗口设置, replace)
该方法的三个参数都是可选的,默认在新页面打开一个空白页。第一个参数可设置要打开窗口的路径。第二个参数规定在何处打开新窗口,也可用于指定窗口的名称。第三个参数设置窗口参数,多个参数可用逗号分隔。如果有第一个参数,后面两个参数可省略,则在新页面打开。第二个参数一般无需设置,如果要规定窗口的参数,则必须有第二个参数,必须为'_blank',或者用'',代替,并且距离屏幕顶部不能为0,否则失效,如果设置了左边距离,顶部可设置为0。最后一个参数规定加载到窗口的URL是在窗口的浏览历史中创建一个条目,还是替换浏览器历史中的当前条目,值为true或false, 值为true时URL替换浏览历史中的当前条目,为false时URL在浏览历史中创建新的条目。
下表是一些常用的窗口设置参数:
参数 | 值 | 说明 |
top | Num | 新窗口距屏幕顶部的距离 |
left | Num | 新窗口距屏幕左端的距离 |
width | Num | 新窗口的宽度 |
height | Num | 新窗口的高度 |
menubar | yes/no/1/0 | 窗口是否有菜单栏,默认是yes |
scrollbars | yes/no/1/0 | 窗口是否有滚动条,默认是yes |
toolbar | yes/no/1/0 | 窗口是否有工具栏,默认是yes |
status | yes/no/1/0 | 窗口是否有状态栏,默认是yes |
location | yes/no/1/0 | 窗口是否显示地址栏,默认是yes |
resizable | yes/no/1/0 | 是否允许改变窗口大小,默认是yes |
directories | yes/no/1/0 | 是否添加目录按钮,默认是yes |
实例:点击按钮,在新窗口打开百度首页,宽600,高400,距屏顶0像素,屏左10像素。
1 <body>2 <input type="button" onClick="newWin()" value="点击我,打开新窗口!">3 <script>4 function newWin(){5 window.open('http://www.baidu.com', '_blank', 'width=600,height=400,top=0,left=10');6 }7 </script>8 </body>
海外公司注册、海外银行开户、跨境平台代入驻、VAT、EPR等知识和在线办理:https://www.xlkjsw.com
原标题:JavaScript学习总结【6】、JS BOM
关键词:JavaScript
*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们:
admin#shaoqun.com
(#换成@)。