【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 ...
随机推荐
- vue之导入Bootstrap和Jquery
Vue引入bootstrap主要有两种方法 方法一:在main.js中引入,此方法导入的bootstrap中对于html,body的一些预设置的css样式可能无效. 一.引入jQuery 在当前项目的 ...
- 解决Unsupported major.minor version 51.0报错问题
问题产生原因:计算机环境变量的jdk版本与eclipse使用的jdk版本不一致 解决方法: 1.查看计算机环境变量的jdk版本 2.查看eclipse项目java compiler的方法:在项目点右键 ...
- sql中保留2位小数
问题: 数据库里的 float momey 类型,都会精确到多位小数.但有时候 我们不需要那么精确,例如,只精确到两位有效数字. 解决: 1. 使用 Round() 函数,如 Round(@num,2 ...
- ycsb安装和使用介绍
nosql性能测试工具ycsb0.1的使用 使用文档参考地址:https://www.cnblogs.com/SailorXiao/p/5808828.html ycsb地址:https://gith ...
- C# 语言 类
++++String类+++++黑色小扳手 - 属性紫色立方体 - 方法 ***字符串.Length - 字符串长度,返回int类型 字符串.TrimStart() - 去掉前空格字符串.TrimEn ...
- Linux配置临时IP地址
# ifconfig 查看网卡信息,如下图所示: # ifconfig eth0 192.168.0.107 eth0表示第一块网卡,Linux中所有的设配都是文件,所以eth0是第一块网卡的文件名, ...
- openstack v3 rest 访问
1. openstack主要面向得是python为主得开发.目前java中嵌入openstack主要是通过rest接口访问 2. 下载一个postman的接口测试工具 3. openstack 中的服 ...
- mysql ERROR 2002 (HY000): Can't connect to local MySQL server through socket '/var/run/mysqld/mysqld.sock' (2 "No such file or directory")
解决方案如下:
- vue 实现走马灯效果
Part.1 问题 在写一个H5页面时遇到一个需求,头部公告需要滚动变换,需要实现一个走马灯效果 Part.2 实现 我的做法:利用 定时器 + CSS3 变换公告数组的顺序 从而实现走马灯效果 ...
- (转发)IOS高级开发~Runtime(一)
IOS高级开发-Runtime(一) IOS高级开发-Runtime(二) IOS高级开发-Runtime(三) IOS高级开发-Runtime(四) 一些公用类: @interface Custom ...