什么是浏览器对象模型？

　　浏览器对象模型（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. phpstorm 快捷键2

    1.跨平台. 2.对PHP支持refactor功能.支持断点调试,支持 Symfony2 和 Yii 的 MVC 视图 3.自动生成phpdoc的注释,非常方便进行大型编程. 4.内置支持Zencod ...

  2. zabbix-agent安装遇到的坑

    问题: libc.so.6(GLIBC_2.14)(64bit) is needed by zabbix-agent-3.4.11-1.el7.x86_64 原因: 系统环境是 centos6 ,下载 ...

  3. juniper 命令

    show chassis hardware 查看系统硬件配置,fpc表示板卡,pic表示板卡中的槽位,xcvr表示板卡中的槽位的端口位置 show chassis envirmonent 查看系统运行 ...

  4. 了解ffmpeg生态

    我以前整理的ffmpeg相关资料: 了解ffmpeg要读的资料 https://blog.csdn.net/yyhustim/article/details/9078941 ffmpeg和ffserv ...

  5. python中对RSA的加密和解密

    首先,生成一对密钥,并保存 def create_keys(): # 生成公钥和私钥 (pubkey, privkey) = rsa.newkeys(1024) pub = pubkey.save_p ...

  6. jpa 中的save()方法

    @RequestMapping(value = "", method = RequestMethod.POST) public String postAccount(@Reques ...

  7. javascript的基础知识点

    一:鼠标提示框 需求描述:鼠标移入都input上,div显示,移出,div消失 分析:控制display=block/none 鼠标移入,鼠标移出事件  <input type="bu ...

  8. react-native window下创建Hello（解决创建一路的坑）

    今天真的颇为激动,1年没有玩RN,竟然被最新的RN版本0.55.4创建Hello折腾了半天,想当年刚玩RN创建环境用了3天, 想想现在也是不容易啊半天就搞定了,目测以后创建的话也就1-2个小时就搞定了 ...

  9. uwsgi 的启动、停止、重启

    ## 一.概念释义### WSGI WSGI 是一个Web服务器(如nginx)与应用服务器(如uWSGI)通信的一种规范(协议).官方定义是,the Python Web Server Gatewa ...

  10. 【leetcode】Submission Details

    Given two sentences words1, words2 (each represented as an array of strings), and a list of similar ...