body对象是document对象的一个成员属性,通过document.body来访问.
使用body对象，要求文档的主体创建后才能使用,
也就是说不能在文档的body体还没有创建就去访问body,
Body常用属性：
appendChild() 添加元素
removeChild() 删除元素
getElementsByTagName() 通过html元素名称,得到对象数组.
bgColor 文档背景色
backgorund 文档背景图
innerText 某个元素间的文本
innerHtml 某个元素间的html代码
onload事件 文档加载时触发
onunload事件 文档关闭时触发
onbeforeunload事件 文档关闭前触发 该对象是 document对象的属性.
innerText innerHTML
案例
<html>
<meta http-equiv="content-type" content="text/html;charset=utf-8"/>
</head>
<body>
<input type="button" value="tesing" οnclick="test()"/>
<span id="myspan"></span>
</body>
<script type="text/javascript">
function test()
{
//myspan.innerText="<a href='http://www.sohu.com'>连接到sohu</a>";
myspan.innerHTML="<a href='http://www.sohu.com'>连接到sohu</a>";
}
</script>
</html>
Body案例：设置固定边栏广告！
<script id=clientEventHandlersJS language=javascript>
<!--
function window_onscroll()
{
//让这个超链接 top 和 left和滚动条，保持一个关系
myHref.style.top=document.body.scrollTop+20;
myHref.style.left=document.body.scrollLeft;
}
function document_onselectstart() {
return false;
//返回false,这样就可以禁止用户选网页中的文本 ，
//当用户选择文本时，会触发 onselectstart 事件，当返回false时，就不会选中
//你也可以在body加入 onselectstart="return false;"同样达到这个效果
}
//-->
</script>
<script language=javascript for=document event=onselectstart>
<!--
//这样的写法等同于再 body上 onselectstart='return false'
window.alert('abc');
return document_onselectstart()
//-->
</script>
</head>
<body οnscrοll="return window_onscroll()" >
<TEXTAREA id="Textarea1" name="Textarea1" rows="500" cols="500">
这个文本域足够大! 有着深远影响和价值的画，就是名画。
一方面所谓的价值体现在作者本人的绘画功底上，有价值的画其作者的绘画功底一定是精湛的，是超凡脱群的，最起码也要有自己的风格，跟别人与众不同，这样才会受到关注。其次，光有精湛的水平也是不够的，还要在画面上体现一种精神，一种思想，也就是说要托画言志，用艺术的手法表现一种有高度的，更深一层的东西。比如说毕加索的格尔尼卡，它的价值就在于用新颖，深刻，抽象的表现手法将残酷的战争诠释的淋淋尽致，把战争的发人深省剖析开来给人看，这种影响是可以穿越肤色，穿越种族，穿越时间和空间的，是有深刻的历史高度的，同时画家自身的画技也不容忽视，所以说它是有价值的。再比如米勒的晚钟，虽然表现的是两位普普通通，穿着朴素，也许并没有什么高学历的勤劳农民，但是他们脸上那种对于上帝的虔诚，那种对于平凡生活的热爱，被米勒用饱含着感情的笔触描绘出来，用其影响力和感染力诠释着价值的内在。
另一方面有些作品之所以成为名画，是因为它所要表达的内涵是永恒的，虽然诞生在那个时代，但是也同样是生活在现代的我们共同追求的大主题，配合着当时的时代背景，加上画家主观的表现提炼，这样创作出来的作品便被称为名画，因此它有着深远影响。
有着深远影响和价值的画，就是名画。
一方面所谓的价值体现在作者本人的绘画功底上，有价值的画其作者的绘画功底一定是精湛的，是超凡脱群的，最起码也要有自己的风格，跟别人与众不同，这样才会受到关注。其次，光有精湛的水平也是不够的，还要在画面上体现一种精神，一种思想，也就是说要托画言志，用艺术的手法表现一种有高度的，更深一层的东西。比如说毕加索的格尔尼卡，它的价值就在于用新颖，深刻，抽象的表现手法将残酷的战争诠释的淋淋尽致，把战争的发人深省剖析开来给人看，这种影响是可以穿越肤色，穿越种族，穿越时间和空间的，是有深刻的历史高度的，同时画家自身的画技也不容忽视，所以说它是有价值的。再比如米勒的晚钟，虽然表现的是两位普普通通，穿着朴素，也许并没有什么高学历的勤劳农民，但是他们脸上那种对于上帝的虔诚，那种对于平凡生活的热爱，被米勒用饱含着感情的笔触描绘出来，用其影响力和感染力诠释着价值的内在。
</TEXTAREA>
<a id = myHref href="http://www.sohu.com" style="LEFT: 0px; POSITION: absolute; TOP: 50px;word-break: keep-all">
<img src="ad.bmp" /></a>
</body> </html>
案例：广告图片在网页中飘动，碰到网页边沿改变漂移方向
<html > <head>
<title>广告图片在网页中飘动</title> </head>
<body style="BACKGROUND-IMAGE: url(./1.png)">
<div id="div1" style="LEFT: 100px; POSITION: absolute; TOP: 0px">
<img src="太阳.gif"/>
</div>
<script language="javascript" type="text/javascript">
<!--
//向x方向移动速度
var divX=1;
//向y方向移动速度
var divY=1;
var posX=0;
//div的x坐标
var posY=0;
//div的y坐标
//window.alert(div1.offsetWidth+" "+div1.offsetHeight);
function move()
{
//让div的横坐标 增加 2*divX
posX+=2*divX;
//让div纵坐标增加 2*divX
posY+=2*divY;
div1.style.top=posY+"px"; div1.style.left=posX+"px";
//posX表示div碰到最左边
//posX+div1.offsetWidth>=document.body.clientWidth 碰到最右
// div自己的宽度
if(posX<=0||posX+div1.offsetWidth>=document.body.clientWidth)
{ divX=-divX; }
//posY表示碰到最上
//posY+div1.offsetHeight>=document.body.clientHeight 碰到最上
if(posY<=0||posY+div1.offsetHeight>=document.body.clientHeight){
divY=-divY;
}
}
//启动一个定时器 setInterval("move()",10);
//-->
</script> </body> </html>
随意拖拽窗口:用户用鼠标点中,浮动窗口,可以随意的拖拽该窗口。
<html> <head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>拖动层</title>
</head>
<script language="javascript">
var x = 0, y = 0, x1 = 0, y1 = 0;
var moveable = false;
var index = 20000;
//开始拖动
function startDrag(obj, evt) {
e = evt ? evt : window.event;
// if (true) {
if (!window.captureEvents) {
obj.setCapture();
} else {
window.captureEvents(Event.MOUSEMOVE | Event.MOUSEUP);
}
var win = obj.parentNode;
//取得父窗体(父窗体就是该div得上一级div)
win.style.zIndex = ++index;//设置父窗体的Z轴值
x = e.clientX;//取得当前鼠标的X坐标
y = e.clientY;//取得当前鼠标的Y坐标
x1 = parseInt(win.style.left);//将父窗体的距浏览器左边界的距离转换为NUMBER
y1 = parseInt(win.style.top);//将父窗体的距浏览器上边界的距离转换为NUMBER
moveable = true;
// }
}
function drag(obj, evt) {
e = evt ? evt : window.event; if (moveable) {
var win = obj.parentNode;
win.style.left = x1 + e.clientX - x;
win.style.top = y1 + e.clientY - y;
}
}
//停止拖动
function stopDrag(obj) {
if (moveable) {
if (!window.captureEvents) {
obj.releaseCapture();
} else {
window.releaseEvents(Event.MOUSEMOVE | Event.MOUSEUP);
}
moveable = false;
}
}
</script>
<body> <div id="l1"
style="position: absolute; width: 200px; height: 200px; background-color: #99CCFF; z-index: 200; top: 100px; left: 154px;">
<div id="title" onMouseDown="startDrag(this,event);"
onMouseMove="drag(this,event);" onMouseUp="stopDrag(this);"
style="width: 200px; height: 20px; background-color: #330033; top: 0px; left: 0px; z-index: 200; position: absolute; font-size: 9pt; color: #FFFFFF; padding-top: 5px; padding-left: 5px;">浮动窗口</div>
</div>
</body> </html>
6903
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
