一、基础知识

1.1,什么是BOM

BOM(browser object model):也叫浏览器对象模型,它提供了很多对象,用于访问浏览器的功能。BOM缺少规范,每个浏览器提供商又按照自己想法去扩展它,那么浏览器共有对象就成了事实的标准,所以,BOM本身是没有标准的或者还没有哪个组织去标准它。

1.2,总体知识

现在学习到的知识,主要是将BOM分成三个对象的学习,分别是window对象、location对象和history对象。

二、Window对象

2.1,定义

是BOM的核心对象,表示浏览器的一个实例 ,window对象处于JavaScript的结构最顶层,对于每个打开的窗口,系统都会自动为其定义Window对象。

2.2,结构

说明:Window对象是最顶层的对象,其下有6大属性,这6大属性本身也是对象。其document属性下,又包括5大属性,其也都是对象。因为Window对象为最顶层的对象,所以,在调用其子对象时,可以不用指明Window。如:下面两句话的效用是一致的!

<span style="font-size:18px;"><span style="font-family:KaiTi_GB2312;font-size:24px;">window.alert(“测试”);
alert(“测试”);</span></span>

2.3,系统对话框

2.3.1,alert()方法

直接弹出对话框:

<span style="font-size:18px;"><span style="font-family:KaiTi_GB2312;font-size:24px;">alert("测试");</span></span>

2.3.2,confirm()方法

这里有确定和取消按钮,本身可以返回一个布尔值:

<span style="font-size:18px;"><span style="font-family:KaiTi_GB2312;font-size:24px;">if (confirm("请选择!")) {
alert("你按了确认按钮");
}
else {
alert("你按了取消按钮");
}</span></span>

2.3.3,prompt()方法

可以在弹出框中输入一个数,然后显示出来:

<span style="font-size:18px;"><span style="font-family:KaiTi_GB2312;font-size:24px;">var box = prompt("请输入一个数字", 0)
if (box != null) {
alert(box);
}</span></span>

2.4,定时器

<span style="font-size:18px;"><span style="font-family:KaiTi_GB2312;font-size:24px;">var num = 0;
var max = 5;
var id = null; function box() {
num++;
document.getElementById("a").innerHTML += num;
if (num==max ) {
clearInterval(id);
alert("5秒到了!");
}
}
id=setInterval(box,1000)</span></span>

三、Location对象

说明:它提供了与当前窗口中加载的文档有关的信息,还提供了一些导航功能。事实上location对象是window对象的属性,也是document对象的属性,所以:window.location和document.location等效。

四、history对象

这个对象属性,保存着用户上网的记录,从窗口被打开的那一刻算起。

<span style="font-size:18px;"><a href="javascript:back();">前一个</a>
<a href="javascript:forward();">后一个</a>
<a href="javascript:go(1);">下一个</a></span>
<span style="font-size:18px;">function back() {
history.back();
} function forward() {
history.forward();
} function go(num) {
history.go(num);
}</span>

五、感想

这些东西,一个一个看来都很简单,就是一些属性和方法的应用。但觉得还是有必要把基础给整理一下,最大的感受:知道那个东西在哪里出现过,其实也很重要。

有了很多东西之后,建立联系好像变得容易点!

【JavaScript 7—基础知识点】:BOM的更多相关文章

  1. JavaScript语言基础知识点图示(转)

    一位牛人归纳的JavaScript 语言基础知识点图示. 1.JavaScript 数据类型 2.JavaScript 变量 3.Javascript 运算符 4.JavaScript 数组 5.Ja ...

  2. JavaScript 语言基础知识点总结

    网上找到的一份JavaScript 语言基础知识点总结,还不错,挺全面的. (来自:http://t.cn/zjbXMmi @刘巍峰 分享 )  

  3. JavaScript语言基础知识点图示

    原文:JavaScript语言基础知识点图示 一位牛人归纳的JavaScript 语言基础知识点图示. 1.JavaScript 数据类型 2.JavaScript 变量 3.Javascript 运 ...

  4. JavaScript 语言基础知识点总结(思维导图)

    JavaScript 数组 JavaScript 函数基础 Javascript 运算符 JavaScript 流程控制 JavaScript 正则表达式 JavaScript 字符串函数 JavaS ...

  5. 【JavaScript 8—基础知识点】:DOM

    一.总体概述 1.1,什么是DOM DOM(Document Object Model):D(文档):整个web加载的网页文档:O(对象):类似于window对象之类的东西,可以调用属性和方法,在这里 ...

  6. JavaScript (JS)基础:BOM 浅析 (含window对象相关基本方法、属性解析)

    ① window对象(Math方法也属于window对象): window对象是JavaScript中的顶级对象,所有定义在全局作用域中的变量.函数都会变成window对象的属性和方法,window对 ...

  7. 【JavaScript 4—基础知识点】:函数

    导读:函数这个东西,从VB开始就一直在用,不过那时候一般写不出来自己的函数或者类,觉得最高大上的,就是调用API函数了.现在,学习到了JavaScript,总结总结函数,显得很有必要.这篇文章,就从最 ...

  8. 【JavaScript 1—基础知识点】:宏观概述

    导读:JavaScript是一门新的(也可以说是旧的或者半新语言),里面有很多的知识点都能和已有的知识产生共鸣.但是,虽然简单,相同点也有很多,也有不同点.我脑袋也不好使,所以对于我来说,还是有必要再 ...

  9. javascript的基础知识点

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

随机推荐

  1. VS局域网断点调试设置

    1.电脑文档文件夹下\IISExpress\config文件内找到applicationhost.config文件编辑 找到<sites>节点 找到你要编辑的site节点 在<bin ...

  2. 初学者应该怎么学习前端?web前端的发展路线大剖析!

    写在最前: 优秀的Web前端开发工程师要在知识体系上既要有广度和深度!应该具备快速学习能力. 前端开发工程师不仅要掌握基本的Web前端开发技术,网站性能优化.SEO和服务器端的基础知识,而且要学会运用 ...

  3. CString的GetBuffer和ReleaseBuffer

    GetBuffer()主要作用是将字符串的缓冲区长度锁定,releaseBuffer则是解除锁定,使得CString对象在以后的代码中继续可以实现长度自适应增长的功能. CString ::GetBu ...

  4. DVWA之文件包含(File inclusion)

    daFile inclusion的意思就是文件包含,当服务器开启了allow_url_include选项时,就可以通过PHP的某些特征函数 include,require和include_once,r ...

  5. 洛谷 2299 Mzc和体委的争夺战

    题目背景 mzc与djn第四弹. 题目描述 mzc家很有钱(开玩笑),他家有n个男家丁(做过前三弹的都知道).但如此之多的男家丁吸引来了我们的体委(矮胖小伙),他要来与mzc争夺男家丁. mzc很生气 ...

  6. codeforces Gym 100338C Important Roads (重建最短路图)

    正反两次最短路用于判断边是不是最短路上的边,把最短路径上的边取出来建图.然后求割边.注意重边,和卡spfa. 正权,好好的dijkstra不用,用什么spfa? #include<bits/st ...

  7. Solr笔记(2)_Schema.xml和solrconfig.xml分析

    现在我们开始研究载入的数据部分(importing data) 在正式开始前,我们先介绍一个存储了大量音乐媒体的网站http://musicbrainz.org , 这里的数据都是免费的,一个大型开放 ...

  8. 洛谷五月月赛【LGR-047】划水记

    虽然月赛有些爆炸,但我永远资瓷洛谷! 因为去接水,所以迟到了十几分钟,然后洛谷首页就打不开了-- 通过洛谷题库间接打开了比赛,看了看\(TA\),WTF?博弈论?再仔细读了读题,嗯,判断奇偶性,不过要 ...

  9. EXTJS中文乱码

    在<head>中加入 <meta http-equiv="Content-Type" content="text/html; charset=GB231 ...

  10. assign, retain, copy, weak, strong

    一.assign, retain, copy 的区别(引用计数 RC reference count) 参考:IOS基础:retain,copy,assign及autorelease 1. 假设你用m ...