javaScript BOM事件的应用

来源：互联网发布：德国淘宝编辑：程序博客网时间：2024/05/21 09:49
<!DOCTYPE HTML><html><head><meta charset="utf-8" ><title>JavaScript（BOM  bowser object model）</title><script type="text/javascript">/*1、document.write('abc')放到一个事件中来用，先会把页面中所有的清空，然后再写。  2、window.open('url'),用来打开另一个页面，可以设置窗口弹出方式'_blank'重新打一个,'_self'覆盖原来的窗口。这个函数返回新弹出的窗口。  3、window.close();不能close由用户打开的页面。  4、window常用的两个属性：window.navigator.userAgent当前浏览器版本信息;window.location当前页面的网址，还可以用来赋值，跳到另一个网址;  5、窗口尺寸、工作区尺寸：可视区大小：document.documentElement.clientWidth;窗口滚动距离：document.documentElement.scrollTop;  6、window.onscroll当页面滚动时发生，window.onresize,当页面尺寸改变时发生。  7、系统对话框：alert('内容');confirm('内容')返回boolean值，prompt('提示语言'，'默认值')，输入框返回字符串或null;*/window.onload=function(){ var oTxt=document.getElementById('txt1'); var oBtn1=document.getElementById('btn1'); var oBtn2=document.getElementById('btn2'); var oBtn3=document.getElementById('btn3');  //alert(window.navigator.userAgent);  //alert(window.location);  oBtn1.onclick=function(){   var oNewWin=window.open('about:blank');   oNewWin.document.write(oTxt.value);  }  oBtn2.onclick=function(){    alert('宽:'+document.documentElement.clientWidth+'  高：'+document.documentElement.clientHeight);  }  oBtn3.onclick=function(){    //兼容IE、火狐    var scrollTop=document.documentElement.scrollTop||document.body.scrollTop;    //alert(scrollTop);  }};//滚动定位window.onscroll=window.onresize=function(){      var oDiv1=document.getElementById('div1');      var scrollTop=document.documentElement.scrollTop||document.body.scrollTop;      //alert(document.documentElement.clientWidth+':'+oDiv1.offsetHeight+':'+scrollTop);      oDiv1.style.top=document.documentElement.clientHeight-oDiv1.offsetHeight+scrollTop+'px';};</script><style type="text/css">#div1{width: 200px;height: 150px;background: red;position: absolute;right: 0;bottom: 0;}</style></head><body style="height:2000px;"><textarea id="txt1"></textarea><input type="button" id="btn1" value="运行"><br><input type="button" id='btn2' value="可视区大小"/><br><input type='button' id="btn3" value='窗口滚动距离'/><div id="div1">固定定位</div></body></html>
0 0