JavaScript对象的常用属性及使用

什么是浏览器对象模型？

　　浏览器对象模型（BOM Browser Object Model）是JavaScript的组成之一，它提供了独立于内容和浏览器窗口进行交互的对象，使用浏览器对象模型可以实现与HTML的交互。

JavaScript中对象分为：

本地对象（native object）、内置对象（built-in object）、宿主对象（host object）。其中本地对象和宿主对象大家一般用的比较多。

使用BOM（浏览器对象模型）可以实现什么功能？

　　（1）弹出新的浏览器窗口

　　（2）移动、关闭浏览器窗口及调整窗口的大小。

　　（3）在浏览器窗口中实现前进和后退方法。

一个浏览器可以看成是一个window对象，下面为大家一一介绍常用三大属性的介绍及使用

　　1）document：提供当前页面的URL信息（比如：http://cn.bing.com/）并且可以重新加载当前页面货载入新页面。

　　　　语法如下：

document.URL

　　2）location：location常用属性是href，通过对此属性设置不同的网址，从而达到跳转功能。

　　　　　　语法如下：

1 <!--首先定义一个函数-->
2 function myclick() {
3                 //定位到百度首页
4                 location.href = "http://www.baidu.com";
5             }

　　3）history：可以实现前进后退及刷新功能

1 history.go(0)    //刷新当前页面
2 history().go(-1)    //后退一页
3 history().go(1)    //前进一页

下面重点来了，定时函数。

定时函数对我们以后的开发web工程师非常有用处的，下面介绍一下定时函数的常用方法及使用：

　　定时函数的常用方法：

　　　　1）setTimeout():用于在指定的毫秒后调用函数或者计算表达式；

　　　　　　语法：

　　　　　　setTimeout("函数名称",毫秒);

　　　　2）setinterval():可按照指定的周期来调用函数或者计算表达式；

　　　　　　语法：

　　　　　　setInterval("函数名称",周期性调用函数之间间隔秒数);

下面简单书写两个关于定时器的例子：

　　　1.setTimeout()

1 //定义一个函数
2 function Refresh()
3 {
4 Time.innerHTML=new Date().toLocaleString()+' 星期'+'日一二三四五六'.charAt(new Date().getDay());
5 setTimeout("Refresh()",1000);
6 }
7 //调用函数，逗号后为毫秒数（一分钟=60秒=60000毫秒）
8 var timer=setTimeout("Refresh()",1000);

　　2.setinterval()

1 //定义一个函数
2 function Refresh()
3 {
4 var newDateObj = new Date();
5 document.form1.txt_Time.value=newDateObj.toLocaleString();//使用当前区域设置并已被转换为字符串
6 }
7 var MyInterval=setInterval("Refresh()",1000);

也可以通过定时器来写一个自娱自乐的小程序，

　　可以每隔1秒换一张图片

 1 <head>
 2 <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
 3     <title>时间函数</title>
 4     <script type="text/javascript">
 5 //定义变量，存储图片名称
 6 var i = 1;
 7         function go() {
 8             if (i<2) {
 9                 i++;
10             } else {
11                 i= 1;//图片循环打印完成再次赋初值1
12             }
13 //获取id为“ima”的doc对象，并为src属性再次赋值（路径）
14             var doc = document.getElementById("ima");
15             doc.src = 'images/iag/' + i + '.jpg';
16         }
17         setInterval(go, 1000);
18 </head>
19 <body>
20 //src为图片路径，所以图片名称均为数组（因为在这里便于逐步遍历出来）
21     <img src="data:images/iag/1.jpg" width="500px" height="600px" id="ima"/>
22 </body>

转载于:https://www.cnblogs.com/Tony-cheen/p/5513069.html

JavaScript对象的常用属性及使用相关推荐

Ajax--概述、xhr对象的常用属性和方法、xhr的常用事件、xhr对象发送POST请求、xhr对象发送GET请求、xhr对象的兼容性问题、数据交换格式(XML、JSON)
一.概述 1.1 发展历程在开始之前先来看一下Ajax的工作原理吧,如下图所示: Ajax全称Asynchronous javascript and xml(异步 JavaScript 和 XML) ...
selenium提取数据之driver对象的常用属性和方法
selenium提取数据之driver对象的常用属性和方法在使用selenium过程中,实例化driver对象后,driver对象有一些常用的属性和方法 driver.page_source 当前标 ...
Python技术分享：ndarray对象的常用属性
NumPy作为高性能科学计算和数据分析的基础包,是介绍其它重要数据分析工具的基础,掌握NumPy的功能及其用法,将有助于后续其他数据分析工具的学习. NumPy中最重要的一个特点就是其N维数组对象,即 ...
爬虫-10-响应对象的常用属性
响应对象的常用属性状态码 status_code 响应头 headers 响应网址请求头
如何更好地理解Javascript对象的自有属性和原型继承属性
Javascript对象具有"自有属性"(own property),也有一些属性是从原型对象继承而来的.为了更好地理解对象自有属性和继承属性下面的示例深入解释了属性的访问和设置细 ...
客户端javascript对象的几何属性（获得大小及坐标）
在一些客户端 javascript 对象中,存在着如宽度.高度.坐标类的几何属性,同时这些属性在不同的浏览器下又有不同的属性名.现在将所有的此类对象的几何属性汇总,便于学习,免得搞混. 1. 浏览器窗 ...
JavaScript之DOM常用属性及方法详解
一.什么是DOM? DOM:文档对象模型(Document Object Model,简称 DOM),是 W3C 组织推荐的处理可扩展标记语言(HTML或者XML)的标准编程接口. W3C 已经定义了 ...
javascript对象覆盖部分属性
需求:只需对现有对象的部分属性覆盖例如: 只需覆盖info中的age属性,可以使用ES6中的解构赋值语法:
如何从 JavaScript 对象中删除属性？
假设我创建一个对象如下: let myObject = {"ircEvent": "PRIVMSG","method": "new ...

JavaScript对象的常用属性及使用

JavaScript对象的常用属性及使用相关推荐

最新文章

热门文章