您的位置：首页 > Web前端 > JavaScript

夺命雷公狗---javascript NO:18 BOM模型

2015-12-09 09:59 483 查看

1、什么是BOM模型

答：当我们打开某一web应用程序，系统会自动生成相关BOM模型，在该模型的最顶级对象是window，其他对象都是该对象的子对象。

2、BOM中常用的属性和方法

1）Window对象

alert(message)：弹出窗口

confirm(message) ：确认窗口

prompt(message[，defstr]) ：提示用户输入信息

close() ：关闭窗口

blur() ：失去焦点

focus() ：获得焦点

print() ：打印窗口

moveBy(x，y)：相对移动

moveTo(x，y)：绝对移动

resizeBy(x，y)：相对大小

resizeTo(x，y) ：绝对大小

scrollBy(x，y)：相对滚动

scrollTo(x，y)：绝对滚动

open(url[，name[，features]])：打开新窗口

open方法中常用的参数

menubar ：菜单栏

toolbar：工具栏

scrollbars：滚动条

fullscreen：全屏

directories：链接工具

location：完整的网址

status：状态栏

resizable：是否可以调整大小，布尔类型true或false

width、height 、left、top

示例代码：

例1：打印与返回顶部

<!DOCTYPE html>
<html>
<head>
<meta charset=’utf-8′>
<title></title>
<script src=’public.js’></script>
<script>
window.onload = function(){
$(‘btnok’).onload = function(){
window.pint
}
$(‘top’).onclick = function(){
window.scrollTo(0,0);
}
}
</script>
</head>
<body>
<div id=”top” style=”width:100px; height:200px; background:url(./gotop.gif); position:fixed;top:500px;right:10px; buttom:10px;”></div>
<div style=”width:50px; height:900px; background:red;”>1</div>
<div style=”width:80px; height:500px; background:blue;”></div>
<input type=”button” id=”btnok” value=”Print”>
</body>
</html>

使用open方法打开新窗口

示例：

<!DOCTYPE html>
<html>
<head>
<meta charset=’utf-8′>
<title></title>
<script src=’public.js’></script>
<script>
window.onload = function(){
$(‘btnWindow’).onclick = function(){
//打开新窗口
window.open(‘http://www.baidu.com’,’_blank’,’width=500,height=400,status=yes’);
}
}
</script>
</head>
<body>
<input type=”button” id=”btnWindow” value=’打开新窗口’>
</body>
</html>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航