一、引入BOM编程:
1、javascript组成部分:
1)EMCAScript(基本语法)
2)BOM( Browser Object Model) 浏览器对象模型.
浏览器对象模型中把浏览器的各个部分都是用了一个对象进行描述,如果我们要操作浏览器的一些属性,我们就可以通过浏览器对象模型的对象进行操作。
3)DOM。
之前已经讲过了EMCAScript(基本语法),接下来说说BOM编程。
2、浏览器对象:
1)window 代表了一个新开的窗口
2)location 代表了地址栏对象。
3)screen 代表了整个屏幕的对象
学习这部分内容就要查阅DHTML文档!
二、window对象:
1、常用的方法:
1)open() 打开一个新的窗口。
2)resizeTo() 将窗口的大小更改为指定的宽度和高度值。
3)moveBy() 相对于原来的窗口移动指定的x、y值。
4)moveTo() 将窗口左上角的屏幕位置移动到指定的 x 和 y 位置。
<!--ad.html-->
<!DOCTYPE html>
<html>
<head>
<title>ad.html</title>
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<!--<link rel="stylesheet" type="text/css" href="./styles.css" target="_blank" rel="external nofollow" >-->
</head>
<body>
<marquee>我是广告,我来了!!</marquee>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">
function showAd(){
window.open("ad.html","_blank","height=400px,width=400px,toolbar=no,location=no,top=200px");
//(属性依次为:要打开的页面,以新建页面的形式高,宽,工具栏不显示,地址栏不显示,距顶部距离),参数不一定都要写,几个都可以
}
function small(){
window.resizeTo(,);//相对于原本窗口改变指定的大小。
}
function move(){
window.moveBy(,); // 相对于原来的窗口移动指定的x、y值,可以多次移动。
}
function move2(){
window.moveTo(,); // 相对于左上角位置移动x、y值,仅能移动一次。
}
</script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>
<body>
<input type="button" onclick="showAd()" value="下载电影"/>
<input type="button" onclick="small()" value="变小"/>
<input type="button" onclick="move()" value="moveBy"/>
<input type="button" onclick="move2()" value="moveTo"/>
</body>
</html>
5)setInterval() 每经过指定毫秒值后就会执行指定的代码。
6)clearInterval() 根据一个任务的ID取消定时任务。
7)setTimeout() 经过指定毫秒值后执行一次指定的代码。
<script type="text/javascript">
function showAd(){
open("ad.html","_blank","height=400px,width=400px,toolbar=no,location=no,top=200px");
setTimeout("showAd()",);
var id =setInterval("showAd()",);
function clearTest(){
clearInterval(id);
}
</script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>
<body>
<input type="button" onclick="showAd()" value="下载电影"/>
<input type="button" onclick="clearTest()" value="取消定时任务"/>
</body>
</html>
2、注意: 使用window对象的任何属性与方法时都可以省略window对象不写。