javascript浏览器对象模型-window对象
window对象是BOM(Browser Object Model)中所有对象的核心
window是宿主对象，代表整个浏览器
function f() {
document.write("function");
}
window.f(); //可省略window
输出 function
var a="keyword";
document.write(window.a); //可省略window
输出 keyword
一、属性
1.位置类型-获得浏览器的位置
window.screenLeft可以获得浏览器距离屏幕左上角的左边距(IE)
火狐 screenX
document.write(screenLeft);
window.screenTop可以获得浏览器距离屏幕左上角的上边距(IE)
火狐 screenY
document.write(screenTop);
位置类型-获得浏览器的大小
火狐
window.innerWidth
火狐window.innerHeight
2.关系类型
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta charset="UTF-8">
<title>javascript浏览器对象模型-window对象</title>
</head>
<frameset rows="20%,*">
<frame src="top.html">
<frameset cols="20%,*">
<frame src="left.html">
<frame src="right.html">
</frameset>
</frameset>
<body>
</body>
</html>
A.parent返回父窗口
B.top返回子窗口
C.self返回当前窗口的引用self==window
D.length设置或返回窗口中的框架数量
E.opener开启者
3.status设置窗口状态栏的文本
window.status="状态栏文本";
二、方法
1.窗体控制
A.窗体的移动
window.moveBy(x,y)相对于当前位置沿着x或y移动指定的像素，如负数则是反方向(IE)
moveBy(100,200); //向右移动100，向下移动200
window.moveTo(x,y)相对浏览器的x或y移动指定的像素，如负数则是反方向(IE)
moveTo(150,250);
B.窗体尺寸的改变
window. resizeBy(x,y)相对当前窗体大小调整宽度和高度(IE)
resizeBy(50,100);
window. resizeTo(x,y)把窗体调整为指定的宽度和高度(IE)
resizeTo(50,150);
2.窗体滚动条的控制
window.scrollBy(x,y)相对于当前滚到条的位置移动的像素(前提是有滚动条)
scrollBy(0,500);
window.scrollTo(x,y)相对于当前窗口的高度或宽度移动到指定的像素
scrollTo(0,700);
3.时间间隔函数
window.setInterval("函数或者代码串",指定的时间[毫秒])按照指定的周期(毫秒)不断地执行函数或者是代码串
setInterval("document.write(' Hi user ')",1000);
var i=0;
setInterval(change,1000);
function change() {
document.write(i+" ");
i++;
}
var a=0;
setInterval(function(){
document.write(a+" ");
a++;
},1000);
setInterval("change(0)",1000);
function change(b) {
document.write(b+" ");
}
window.clearInterval()清除计时器
<button id="stop">停止</button>
<div id="content"></div>
<script>
window.onload=function () {
var t=setInterval(printWord,1000);
function printWord() {
var div= document.getElementById("content");
div.innerText+=" Hey Boy ";
}
var btnStop=document.getElementById("stop");
btnStop.onclick=function () {
clearInterval(t);
}
};
</script>
window.setTimeout("函数或者代码串",指定的时间[毫秒])在指定的毫秒数后只执行一次函数或者是代码串
setTimeout("document.write('Hey boy')",2000);
<button id="stop">停止</button>
<div id="content"></div>
<script>
window.onload=function () {
var t=setTimeout(printWord,1000);
function printWord() {
var div= document.getElementById("content");
div.innerText+=" Hey Boy ";
}
var btnStop=document.getElementById("stop");
btnStop.onclick=function () {
clearTimeout(t);
}
};
</script>
window.clearTimeout()清除计时器
4.打开新的窗口
window.open(url,name,features,replace)(IE)
window.open("top.html","百度","status=0,scrollbars=1,directions=1,channelmode=1,menubar=1");
网友评论