什么是浏览器对象模型？

　　浏览器对象模型（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，通过对此属性设置不同的网址，从而达到跳转功能。

　　　　　　语法如下：

 <!--首先定义一个函数-->

 function myclick() {

                 //定位到百度首页

                 location.href = "http://www.baidu.com";

             }

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

 history.go(0)    //刷新当前页面

 history().go(-1)    //后退一页

 history().go(1)    //前进一页

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

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

　　定时函数的常用方法：

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

　　　　　　语法：

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

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

　　　　　　语法：

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

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

　　　1.setTimeout()

 //定义一个函数

 function Refresh()

 {

 Time.innerHTML=new Date().toLocaleString()+' 星期'+'日一二三四五六'.charAt(new Date().getDay());

 setTimeout("Refresh()",1000);

 }

 //调用函数，逗号后为毫秒数（一分钟=60秒=60000毫秒）

 var timer=setTimeout("Refresh()",1000);

　　2.setinterval()

 //定义一个函数

 function Refresh()

 {

 var newDateObj = new Date();

 document.form1.txt_Time.value=newDateObj.toLocaleString();//使用当前区域设置并已被转换为字符串

 }

 var MyInterval=setInterval("Refresh()",1000);

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

　　可以每隔1秒换一张图片

 <head>

 <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

     <title>时间函数</title>

     <script type="text/javascript">

 //定义变量，存储图片名称

 var i = 1;

         function go() {

             if (i<2) {

                 i++;

             } else {

                 i= 1;//图片循环打印完成再次赋初值1

             }

 //获取id为“ima”的doc对象，并为src属性再次赋值（路径）

             var doc = document.getElementById("ima");

             doc.src = 'images/iag/' + i + '.jpg';

         }

         setInterval(go, 1000);

 </head>

 <body>

 //src为图片路径，所以图片名称均为数组（因为在这里便于逐步遍历出来）

     <img src="data:images/iag/1.jpg" width="500px" height="600px" id="ima"/>

 </body>

JavaScript对象的常用属性及使用的更多相关文章

  1. JavaScript BOM-11-BOM的核心-window对象; window对象的控制,弹出窗口方法; 超时调用; 间歇调用; location对象常用属性; 位置操作--location.reaplace,location.reload(); BOM中的history对象; Screen对象及其常用属性; Navigator对象;

    JavaScript BOM 学习目标 1.掌握什么是BOM 2.掌握BOM的核心-window对象 3.掌握window对象的控制.弹出窗口方法 什么是bom BOM(browser object ...

  2. JavaScript中Number常用属性和方法

    title: JavaScript中Number常用属性和方法 toc: false date: 2018-10-13 12:31:42 Number.MAX_VALUE--1.79769313486 ...

  3. JavaScript对象的property属性详解

    JavaScript对象的property属性详解:https://www.jb51.net/article/48594.htm JS原型与原型链终极详解_proto_.prototype及const ...

  4. JavaScript对象就是一组属性(方法)的集合

    在JavaScript中,每个对象可以看作是多个属性(方法)的集合,引用一个属性(方法) 很简单,即: 对象名.属性(方法)名 除此之外,还可以用方括号的形式来引用: 对象名[“属性(方法)名”] 注 ...

  5. javascript中array常用属性方法

    属性: length 表示一个无符号 32-bit 整数,返回一个数组中的元素个数. 截短数组..截短至长度2  则:   .length = 2 方法: Array.from() 方法可以将一个类数 ...

  6. 【JavaScript】浅析JavaScript对象如何添加属性和方法

    向JavaScript类中添加属性和方法,最直观的做法就是在类中定义属性和方法.JavaScript是一门弱语言,除了直接定义还可以用prototype来添加. 下面介绍从外部向JavaScript添 ...

  7. JavaScript对象中的属性(可写，可配置，可枚举，value,getter,setter)

    JavaScript中,对象包括3个特性,分别为,可扩展性,class标识符,属性. 如果对象的可扩展性为false,则不可为对象动态的添加属性.   对象包含分为存取器属性和值属性.存取属性为 {g ...

  8. DOM中document对象的常用属性方法

    每个载入浏览器的 HTML 文档都会成为 Document 对象. Document 对象使我们可以从脚本中对 HTML 页面中的所有元素进行访问. 属性 1  document.anchors  返 ...

  9. String对象的常用属性和方法

    属性 描述 length 在大多数情况下返回字符串中的字符数 方法 描述 toUpperCase() 将字符串修改为大写字母 toLowerCase() 将字符串修改为小写字母 charAt() 以索 ...

随机推荐

  1. Redis【3】其他部分~

    Java连接VMware的Redis:ping()返回PONG 要可以ping通VMware地址 端口号要正确.默认6379 VMware中的防火墙原因.需添加6379端口号的防火墙: vim /et ...

  2. 一、Core授权-2 之.net core 基于Jwt实现Token令牌

    一.Startup类配置 ConfigureServices中 //添加jwt验证: services.AddAuthentication(JwtBearerDefaults.Authenticati ...

  3. 一、Signalr WebApi客服-客户链接+Redis

    一.前端客服代码 <!doctype html> <html> <head> <meta charset="utf-8"> < ...

  4. Java Script入门

    学习来源:https://www.runoob.com/js/js-tutorial.html JavaScript 教程 JavaScript 是 Web 的编程语言. 所有现代的 HTML 页面都 ...

  5. java数据结构复习02

    1.递归问题 1.1汉诺塔问题(递归) 问题描述三个柱子,起初有若干个按大小关系顺序安放的盘子,需要全部移动到另外一个柱子上.移动规则:在小圆盘上不能放大圆盘,在三根柱子之间一次只能移动一个圆盘.移动 ...

  6. vue interceptors(拦截器)

    拦截器 顾名思义: 就是半路个您劫持, 拦截器 其实在项目和自己写demo中,总会遇到请求方面需要在请求头里面做判断或者添加一些东西, 这时候 vue 中应用中axios的 interceptors  ...

  7. 判断一个对象是否为空？ js

    其实开发过程中常常会遇到判断对象和数组是否为空?下面介绍3种判断对象是否为空 1. 最常见的思路,for...in...遍历属性,为真则为“非空数组”:否则为“空数组” function judgeO ...

  8. SpringBoot框架(6)--事件监听

    一.场景:类与类之间的消息通信,例如创建一个对象前后做拦截,日志等等相应的事件处理. 二.事件监听步骤 (1)自定义事件继承ApplicationEvent抽象类 (2)自定义事件监听器,一般实现Ap ...

  9. 伸展树splay之求区间极值

    前言 这篇博客是根据我在打这道题的时候遇到的问题,来打的,有些细节可能考虑不到. 题目 在N(1<=N<=100000)个数A1-An组成的序列上进行M(1<=M<=10000 ...

  10. 【c++】一道关于继承和析构的笔试题

    题目如下,求输出结果 class A { public: A() { cout<<"A"<<endl; } ~A() { cout<<" ...