`

j2ee06js04.Bom浏览器对象(包含document、location、history)

    博客分类:
  • j2ee
 
阅读更多

第一:基本概念

BOM:b是浏览器,因此bom是浏览器对象模型
   这个对象就是window对象
    1.window节点(对象)下有三个子节点,分别是location,document,history
    2.window对象封装当前浏览器(一个窗口就是一个window对象),document对象封装一个html文档,
     location对象封装浏览器中的地址栏(http://localhost...),history对象封装着是历史记录(也就是前进和后退),封装着以访问过的地址列表
3.改变了地址也就改变了documwent中的内容
4.打开窗口就是创建一个window对象,window是dom树的根节点,因此打开窗口之后就能用window对象中的方法
  ---方法1.弹出:alert(),相当于window.alert();window由于是根节点,因此可以省略
  ---方法2:打开窗口:open(),或者window.open();,第一个参数是路径,第二个参数是逻辑名,第三个参数是窗口特征。locaction=1表示显示地址栏,默认是0
                      status表示状态栏(看下边)
  ---方法3:关闭窗口:close()
  ----方法4:确认对话框:confirm()肯佛么当关闭窗口的时候要求弹出是否要关闭:因此需要一个确认对话框.他的值是确定(ture)或者取消(false)
             这个方法经常跟if一起使用
 -----方法5:focus():获得焦点
  ---方法6和7:开启两种定时器:setInterval():让表达式每经过指定的毫秒数之后执行一次,他有两个参数,一个参数是vocde,表示代码,另一个参数是时间(毫秒),他的返回值是定时器的id
               setTimeout():经过指定毫秒数执行表达式
  -----方法8和9:停止定时器:
                -----clearTnterval(),他有一个参数是id,也就是启动定时器时候的返回值
                -----clearTimeout()
toLocaleString()和toLocaleDateString():格式化时间,是日期对象的方法(喽口:Locale)

   ----方法10:提示输入:prompt():他有个返回值,这个返回值就是我们在文本框中输入的内容
   ---方法11:showModalDialog():产生一个模式窗口(先关闭后才能操作其他窗口)

5.location对象(喽k神);
     ---location.reload()方法;是刷新的意思,默认参数是false
     -----assign()方法:重新打开一个新的html页面,参数是个地址
     -----locaction.href属性:是获得当前地址,locaction.href=“”设置地址
6.history对象
     方法1:back()后退
     方法2:forword()前进
    属性:length查找长度

 

 

第二:代码实现

 

1.window对象的打开和关闭

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script type="text/javascript">
  var id=0;
  var int;
  function myopen(){
   window.open("显示时间.html","","width=200px,heigh=200px,location=1,titlebar=1");
  }
  function mysetInterval(){
    id=window.setInterval("myopen()",3000);//定时重复打开,返回值是一个int类型的
  }
  function mycloseInterval(){
   window.clearInterval(id);//关闭浏览器,需要打开浏览器的返回值,也就是说需要打开浏览器时候的id,因此这个id要全局变量
  }
  function mysetTimeout(){
   int=window.setTimeout("myopen()",2000);//定时打开一次浏览器
  }
  function mycloseTimeout(){//关闭浏览器,由于window是根节点,因此window可以省略,由于这是执行一次,因此没必要关闭
   clearTimeout(idt);
  }

</script>
</head>

<body onload="myopen()">
<div style="text-align:center">
    <h3 align="center">测试window对象</h3>
   <input type="button" onclick="mysetInterval()" value="重复打开广告"/>
   <input type="button" onclick="mycloseInterval()" value="关闭重复打开广告"/>
   <input type="button" onclick="mysetTimeout()" value="定时打开一次浏览器" />
</div>

</body>
</html>

 

2.location对象和history对象

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script type="text/javascript">
      function test(){
    location.href="adv.html";
   }
</script>
</head>

<body>
<a href="javascript:location.reload(true)">刷新</a>
<a href="javascript:location.assign('adv.html')">重新打开一个网页</a>
<a href="javascript:test()">改变地址栏的地址</a>
<a href="javascript:history.forward()">前进</a>
</body>
</html>


   

分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics