本節主要講解JavaScript中的Windows對象,浏覽器本身常用對象的使用,BOM。
一、浏覽器本身自己就有一些對象,不用建立就可以使用
wondow :代表目前流量器窗體的
屬性:status 狀态欄
opener 在子窗體中代表父窗體的對象
closed
parent
top
方法:
alert()
confirm()
setInterval()//頁面動的東西
clearInterval()
setTimeout() //隻執行一次
clearTimeout()
open() //打開一個新窗體的是與原窗體有關系的
window包括子對象document ; event; frames//分幀 ; location
[window].成員:window可以省略 隻有window可以省略
例1
<a href="del.php" target="_blank" rel="external nofollow" οnclick="return confirm('你确定要删除嗎?')">删除</a>
例2
<div id="one" style="position:absolute:left:0; top:0;width:100px;height:100px;">我是廣告</div>
<script>
var x=0;
var y=0;
var xs=10;
var ys=10;
var one=document.getElementById("one");
function move(){
x+=xs;
y+=ys;
if(x>=document.body.clientWidth-one.offsetWidth-20 ||x<=0){
xs=-1*xs;
}
if(y>=document.body.clientHeight-one.offsetHeight-20 ||y<=0){
ys=-1*ys;
}
one.style.left=x;
one.style.top=y;
}
var dt=setInterval("move()",100);
one.οnmοuseοver=function(){
clearInterval(dt);
}
one.οnmοuseοut=function(){
dt=setInterVal("move()",100);
}
</script>
例3
<body>
<script>
setTimeout(function(){
document.bgColor="red";
},3000;)
setTimeout(function(){
document.bgColor="blue";
},6000);
setTimeout(function(){
document.bgColor="green";
},9000);
function stop(){
clearTimeout(two);
}
</script>
<input type="button" οnclick="stop()" value="add">
</body>
例4//也是打開一個新窗體 但是open()方法是與父窗體是有聯系的。而這個是無聯系的
<body>
<a href="1.html" target="_blank" rel="external nofollow" target="_blank">新</a>
</body>
window對象(下)
window.open("url","windowName","windowFeature")
例1 //在父窗體中操作子窗體
<body οnunlοad="closeit()">
<script>
var subwin=window.open("win.html","_blank","top=300,left=300,width=200,height=200,fullscreen=yes");//傳回的是子窗體
function show(obj){
subwin.document.bgColor=obj.value;
}
function demo(){
window.document.title="qqqqqq";
}
function closeit(){ //如果關閉父窗體那麼子窗體也跟着關閉了
if(subwin.closed){
subwin.close();
}
}
</script>
<input type="button" οnclick="show(this)" value="red"><br>
<input type="button" οnclick="show(this)" value="green"><br>
<input type="button" οnclick="show(this)" value="yello"><br>
<input type="button" οnclick="show(this)" value="blue"><br>
<input type="button" οnclick="show(this)" value="#ff00ff"><br>
</body>
例2//在子窗體總操作父窗體
在win.html中寫
<body>
<script>
opener.demo();//子窗體調用父窗體裡的方法
function show(obj){
opener.document.bgColor=obj.value;
}
</script>
<input type="button" οnclick="show(this)" value="red"><br>
<input type="button" οnclick="show(this)" value="green"><br>
<input type="button" οnclick="show(this)" value="yello"><br>
<input type="button" οnclick="show(this)" value="blue"><br>
<input type="button" οnclick="show(this)" value="#ff00ff"><br>
</body>
例3//讓本身的窗體慢慢變大 然後過5秒關閉
<body>
<script>
opener.demo();
function show(obj){
opener.document.bgColor=obj.value;
}
setInterval(function(){
window.resizeBy(5,5);//相對變大
},100);
setTimeout(function(){
window.close();
},5000)
</script>
<input type="button" οnclick="show(this)" value="red"><br>
<input type="button" οnclick="show(this)" value="green"><br>
<input type="button" οnclick="show(this)" value="yello"><br>
<input type="button" οnclick="show(this)" value="blue"><br>
<input type="button" οnclick="show(this)" value="#ff00ff"><br>
</body>
例4
<body οnunlοad="closeit()">
<script>
var subwin=window.open("win.html","_blank","top=300,left=300,width=200,height=200,fullscreen=yes");//傳回的是子窗體
function show(obj){
subwin.document.bgColor=obj.value;
}
function demo(){
window.document.title="qqqqqq";
}
function closeit(){ //如果關閉父窗體那麼子窗體也跟着關閉了
if(subwin.closed){
subwin.close();
}
}
var num=0;
var dir=1;
setInterval(function(){
if(num>40||num<0){
dir=-1*dir
}
num+=dir;
var space=""
for(var i=0;i<num;i++){
space+="";
}
window.status=space+"www.borther.com";
},100)
</script>
<input type="button" οnclick="show(this)" value="red"><br>
<input type="button" οnclick="show(this)" value="green"><br>
<input type="button" οnclick="show(this)" value="yello"><br>
<input type="button" οnclick="show(this)" value="blue"><br>
<input type="button" οnclick="show(this)" value="#ff00ff"><br>
</body>
document
frames
location
history
screen
例5
<frameset rows="100,*">
<frame name="top">
<frameset cols="150,*">
<frame name="menu" src="menu.html"/>
<frame name="main"/>
</frameset>
</frame>
</frameset>
menu.html
<input type="button" οnclick="window.document.bgColor='yellow'" value="改自己的"><br>
<input type="button" οnclick="window.parent.parent.frames[0].document.bgColor='green'" value="改上面的"><br>
<input type="button" οnclick="window.top.frames.['main'].document.bgColor='blue'" value="改右面的"><br>
知識小結
[window.]成員
document.write();
本身window
open可以彈出子窗體
frames多個窗體