1，dom对象层次一览表
2，body对象
1、onselectstart用户选中文档body体的内容时触发
2、onscroll用户拉动滚动条时触发
特别说明：onscroll在使用时需要遵循html4.0的标准，否则不能执行，也可以使用window.onscroll=函数名来代替body对象的onscroll事件
<html>
<head>
<title>document示例</title>
<script language="javascript" type="text/javascript">
<!--
function window_onscroll(){
myHref.style.top=document.body.scrollTop+50;
myHref.style.left=document.body.scrollLeft;
}
function document_onselectstart(){
alert("121");
return false;//返回false,可以禁止用户选网页中的文本；当用户选文本时会触发onselectstart事件，返回false就不会选中
//也可在body中加入onselectstart="return false"同样达到这个效果
}
//-->
</script>
<script language="javascript" for=document event=onselectstart>
<!--
//这样等于与在body上写入onselectstart="return false"
return document_onselectstart();
//-->
</script>
</head>
<body onscroll="return window_onscroll()">
<TEXTAREA id="Textareal" name="Textareal" rows="500" cols="500">
asdfzxcvqwerzasdvzxcfawdsf
</TEXTAREA>
<a id="myHref" href="http://www.sohu.com"
style="left:0px;position:absolute;top:50px;word-break:keep-all">
<img src="sohu.jpg" />//随便找个图片
</a>
</body>
</html>
3，
body对象
案例：
一个小太阳，当它碰到边框后，就自动的转变方向，很多流氓网站就有这种广告。
知识点：
1、document.body.clientWidth //获得客户端浏览器的宽度
2、document.body.clientHeight //获得客户端浏览器的高度
3、offsetWidth //获得当前对象的宽度
4、offsetHeight //获得当前对象的高度
<html>
<head>
<title>document示例 </title>
<script language="javascript" type="text/javascript">
<!--
//定两个方向
var directX=1;//X轴的方向
var directY=1;//Y轴的方向
var sunX=0;//太阳的坐标
var sunY=0;
var speed=1;
function sunMove(){
sunX+=directX*speed;
sunY+=directY*speed;
var sundiv=document.getElementById("sundiv");
//修改div的left top
sundiv.style.top=sunY+"px";
sundiv.style.left=sunX+"px";
//判断什么时候转变方向
//判断X方向转向 (offsetWidth可以返回当前对象的实际宽度)
if(sunX+sundiv.offsetWidth>=document.body.clientWidth||sunX<=0){
directX=-directX;
}
//上面的if语句等价于下面的if
/*if(sunX+sundiv.offsetWidth>=document.body.clientWidth){
divectX=-1;
}else if(sunX<=0){
divectX=1;
}*/
//判断Y方向转向
if(sunY+sundiv.offsetHeight>=document.body.clientHeight||sunY<=0){
directY=-directY;
}
}
setInterval("sunMove()",10);
//-->
</script>
</head>
<body style="background-image: url('./ship.jpg');background-repeat:no-repeat;">
<div id="sundiv" style="position:absolute">
<img src="sun.gif" />
</div>
</body>
</html>