javaScript BOM事件的应用

最新推荐文章于 2024-04-01 13:40:45 发布

回_憶

最新推荐文章于 2024-04-01 13:40:45 发布

阅读量1.1k

点赞数

分类专栏： JavaScript 文章标签： javascript 浏览器 BOM

本文链接：https://blog.csdn.net/angjunqiang/article/details/41594309

版权

JavaScript 专栏收录该内容

18 篇文章 0 订阅

订阅专栏

<!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.οnlοad=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.οnclick=function(){
   var oNewWin=window.open('about:blank');
   oNewWin.document.write(oTxt.value);
  }
  oBtn2.οnclick=function(){
    alert('宽:'+document.documentElement.clientWidth+'  高：'+document.documentElement.clientHeight);
  }
  oBtn3.οnclick=function(){
    //兼容IE、火狐
    var scrollTop=document.documentElement.scrollTop||document.body.scrollTop;
    //alert(scrollTop);
  }
};
//滚动定位
window.οnscrοll=window.οnresize=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

收藏

觉得还不错? 一键收藏
0
评论
javaScript BOM事件的应用

JavaScript（BOM bowser object model）/*1、document.write('abc')放到一个事件中来用，先会把页面中所有的清空，然后再写。 2、window.open('url'),用来打开另一个页面，可以设置窗口弹出方式'_blank'重新打一个,'_self'覆盖原来的窗口。这个函数返回新弹出的窗口。 3、window.close();不能cl
复制链接

扫一扫

专栏目录