Javascript（BOM）浏览器对象 2017-08-01

最新推荐文章于 2024-05-01 09:00:00 发布

CasvotLee

最新推荐文章于 2024-05-01 09:00:00 发布

阅读量215

点赞数

本文链接：https://blog.csdn.net/ledgewont/article/details/76520381

版权

1. JavaScript中的窗口（window）对象(回顾)

2. JavaScript 中的计时器

在JavaScript中，我们可以在设定的时间间隔之后来执行代码，而不是在函数被调用后立即执行。

计时器类型：
一次性计时器：仅在指定的延迟时间之后触发一次。
间隔性触发计时器：每隔一定的时间间隔就触发一次。

一些计时器方法：

1）setInterval(code,interval_time)

①. 代码：要调用的函数或要执行的代码串。

②交互时间：周期性执行或调用表达式之间的时间间隔，以毫秒计（1s=1000ms）。

另(转)：js中self的用法：https://www.cnblogs.com/reommmm/archive/2010/01/20/1652469.html

实例：使用计时器让网页显示动态时间

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>定时器</title>
<script type="text/javascript">
  var attime;
  function clock(){
    var time=new Date();          
    attime= time.getHours()+"时"+time.getMinutes()+"分"+time.getSeconds()+"秒" ;           //获取时，分，秒并博保存在attime中
    document.getElementById("clock").value = attime;    //把attime传送到text框中显示。
  }
  setInterval(clock,1000);
</script>
</head>
<body>
<form>
<input type="text" id="clock" size="50"  />
</form>
</body>
</html>

2）清除/停止计时器 clearInterval（id_of_setInterval)

3) 延迟一次指定时间执行代码 setTimeout（code,layback），常常用来计数。

4)清除计时器clearTimeout（id_of_setInterval）

经常配合setTimeout（）使用。

参数说明:
id_of_setTimeout：由 setTimeout() 返回的 ID 值。该值标识要取消的延迟执行代码块。

3.history对象

history对象记录了用户曾经浏览过的页面(URL)，并可以实现浏览器前进与后退相似导航的功能。

注意:

从窗口被打开的那一刻开始记录，每个浏览器窗口、每个标签页乃至每个框架，都有自己的history对象与特定的window对象关联。

语法：

window.history.[属性|方法] // window可以省略。

属性：length ; 返回浏览器历史纪录的URL数量

方法：back（）：加载前一个url

forward（）：加载下一个url

go（）：加载某个具体页面

①back()方法

加载 history 列表中的前一个 URL。
语法：
window.history.back();
比如，返回前一个浏览的页面，代码如下：

window.history.back();

注意：等同于点击浏览器上的的倒退(->)按钮。
back()相当于go(-1),代码如下:
window.history.go(-1);

②返回下一个浏览过的页面forward（）

格式： window.history.forward();

等同于： window.histroy.go(1);

③返回指定页面go（）

window.history.go(num);

4. location对象

基本格式： location.属性/方法

location用于获取或者设置当前页面的Url

例如获取当前页面的完整URL：var url=location.href;

5.navigator对象

navigator是在JavaScript中的一个独立的对象，他用于提供用户所使用的浏览器以及操作系统等信息，以navigator对象属性的形式来提供。

7. screen 对象

语法：

window.screen.属性

screen属性有：

①宽高：

var  width=window.screen.width;
	var height=window .screen.height;
	document.write(width+" ");
	document.write(height);

②可用宽高（减去任务栏，标签栏等等可用的页面宽高）

 var  width=window.screen.availWidth;
	var height=window .screen.availHeight;

③Exercise

制作跳转页面

<!DOCTYPE html>
<html>
 <head>
  <title>浏览器对象</title>  
  <meta http-equiv="Content-Type" content="text/html; charset=gkb"/>   
 </head>
 <body>
      <h>Successful！</h>
  <br/>
  
  After <b id="sec">5</b>  secends.  <a href="javascript:goBack();">goBack</a>              //一些布局
 
  <script type="text/javascript">  
     
	  var s=5;
	var i=self.setInterval(timer,1000);         //获取i，并用于停止计时，注意这里使用了一次计时方法，接下来就不能在使用此方法了，否则会造成多线程计数，你懂的。。。。。

	  function timer()
	  {
		  s--;
		  document.getElementById("sec").innerHTML=s;              //把倒计时数值送出显示
		  if(s==0)
			  {
				  clearInterval(i);                                                   //停止计时
				  location.href="https://www.google.com/";           //由本页面跳转到另外网站
				  
			  }
	  }
   
	  function goBack()                              //和goBack配合使用，用于回到上一页。点击连接可触发此事件
	  {
		  window.history.go(-1);
	  }
	 
 </script> 
 
</body>
</html>

CasvotLee

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Javascript（BOM）浏览器对象 2017-08-01

1. JavaScript中的窗口（window）对象(回顾)2. JavaScript 中的计时器在JavaScript中，我们可以在设定的时间间隔之后来执行代码，而不是在函数被调用后立即执行。计时器类型：一次性计时器：仅在指定的延迟时间之后触发一次。间隔性触发计时器：每隔一定的时间间隔就触发一次。一些计时器方法：1）setInterval(code,inte
复制链接

扫一扫