【JavaScript 7—基础知识点】:BOM
一、基础知识
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的更多相关文章
- JavaScript语言基础知识点图示(转)
一位牛人归纳的JavaScript 语言基础知识点图示. 1.JavaScript 数据类型 2.JavaScript 变量 3.Javascript 运算符 4.JavaScript 数组 5.Ja ...
- JavaScript 语言基础知识点总结
网上找到的一份JavaScript 语言基础知识点总结,还不错,挺全面的. (来自:http://t.cn/zjbXMmi @刘巍峰 分享 )
- JavaScript语言基础知识点图示
原文:JavaScript语言基础知识点图示 一位牛人归纳的JavaScript 语言基础知识点图示. 1.JavaScript 数据类型 2.JavaScript 变量 3.Javascript 运 ...
- JavaScript 语言基础知识点总结(思维导图)
JavaScript 数组 JavaScript 函数基础 Javascript 运算符 JavaScript 流程控制 JavaScript 正则表达式 JavaScript 字符串函数 JavaS ...
- 【JavaScript 8—基础知识点】:DOM
一.总体概述 1.1,什么是DOM DOM(Document Object Model):D(文档):整个web加载的网页文档:O(对象):类似于window对象之类的东西,可以调用属性和方法,在这里 ...
- JavaScript (JS)基础:BOM 浅析 (含window对象相关基本方法、属性解析)
① window对象(Math方法也属于window对象): window对象是JavaScript中的顶级对象,所有定义在全局作用域中的变量.函数都会变成window对象的属性和方法,window对 ...
- 【JavaScript 4—基础知识点】:函数
导读:函数这个东西,从VB开始就一直在用,不过那时候一般写不出来自己的函数或者类,觉得最高大上的,就是调用API函数了.现在,学习到了JavaScript,总结总结函数,显得很有必要.这篇文章,就从最 ...
- 【JavaScript 1—基础知识点】:宏观概述
导读:JavaScript是一门新的(也可以说是旧的或者半新语言),里面有很多的知识点都能和已有的知识产生共鸣.但是,虽然简单,相同点也有很多,也有不同点.我脑袋也不好使,所以对于我来说,还是有必要再 ...
- javascript的基础知识点
一:鼠标提示框 需求描述:鼠标移入都input上,div显示,移出,div消失 分析:控制display=block/none 鼠标移入,鼠标移出事件 <input type="bu ...
随机推荐
- [转]AngularJS:何时应该使用Directive、Controller、Service?
AngularJS是一款非常强大的前端MVC框架.同时,它也引入了相当多的概念,这些概念我们可能不是太熟悉.(译者注:老外真谦虚,我大天朝的码农对这些概念那是相当熟悉啊!)这些概念有: Directi ...
- 前端之css(宽高)设置小技巧
一.css宽高自适应: 1.宽度自适应: 元素宽度设为100%(块状元素的默认宽度为100%) 注:应用在通栏效果中 2.高度自适应: height:auto;或者不设置高度 3.最小,最大高度,最小 ...
- nodejs中的异步回调机制
1.再次clear Timer定时器的作用 setTimeOut绝非是传统意义上的“sleep”功能,它做不到让主线程“熄火”指定时间,它是用来指定:某个回调在固定时间后插入执行栈!(实际执行时间略长 ...
- JS判断两个对象相同属性的属性值是否相等
function isObjectValueEqual(a, b) { var aProps = Object.getOwnPropertyNames(a); var bProps = Object. ...
- 目后佐道IT教育:教学环境
目后佐道IT教育的品牌故事 http://www.cnblogs.com/itpua/p/7710917.html 目后佐道IT教育的师资团队 http://www.cnblogs.com/itpua ...
- android stuido ndk 开发
开发环境: Android studio 1.0.2 ndk android-ndk-r10d-windows-x86_64 ------------------------------------ ...
- windows/Linux 常用命令
windows 文件操作命令 cd 切换文件目录 dir 显示文件目录内容 md 创建文件夹 rd 删除文件夹 copy 拷贝文件 move 移动文件 del 删除文件 replace 替换文件 mk ...
- Prim算法解决最小生成树
一.最小生成树问题 什么是最小生成树问题?给你一个带权连通图,需要你删去一些边,使它成为一颗权值最小的树. 二.Prim算法 1)输入:输入一个带权连通图,顶点集合V,边集合E 2)初始化:Vnew= ...
- Linux中fork函数的例子
- vue 数组更新 this.$set(this.dataList, data.index, data.data)
vue 数组更新 this.$set(this.dataList, data.index, data.data) https://www.cnblogs.com/huangenai/p/9836811 ...