【JavaScript】案例3:定时弹广告以及BOM对象

简介: 本期主要介绍案例3:定时弹广告以及BOM对象

1. 案例 3:定时弹广告


1.1 需求说明


网站顶部在页面打开两秒后显示广告图;

广告图展示两秒后关闭广告图;

image.png

1.2 需求分析


image.png

提示:1、元素.className 会访问 元素的 class 属性值

1.3 案例代码实现


image.png

2. BOM 对象


2.1 BOM 对象是什么?有什么用?


BOM (Browser Object Model)浏览器对象模型

浏览器: IE 、火狐、谷歌等

作用:用来执行浏览器的相关操作。(例如:浏览器的地址、弹出消息等)

一般情况下, window 代表了 BOM 对象。

window 对象是 JavaScript 的内置对象,使用 window 对象调用方法时可以省略 window 不写。

image.png

2.2 BOM 对象消息框


方法:消息框

image.png

image.png

2.3 BOM 对象-location 对象


location 对象包含浏览器 地址栏 的信息。

image.png

2.4 BOM 对象-history 对象(了解)


image.png

go() 方法:跳转到历史列表中的指定页面

a) go(-1) 加载前一个连接,等效 back()

b) go(1) 加载后一个链接,等效 forward()

image.png

3. 课外扩展(了解)


3.1 脚本语言历史介绍


1992 年, Nombas 公司开发 Cmm (C-minus-minus )嵌入式脚本语言,后更名为 ScriptEase 。1995 年 Netscape 网景公司开发 Netscape Navigator 2.0 浏览器内置的 LiveScript 脚本语言,NetscapeNavigator 2.0 即将正式发布前, Netscape 将其更名为 JavaScript同时,微软进军浏览器,发布了 IE 3.0 并搭载了一个 JavaScript 的克隆版,叫做 JScript1997 年, TC39 委员会为了统一脚本语言推出 ECMA-262 标准,标准将脚本语言命名为ECMAScript 。

如今,所有主流浏览器都遵守 ECMA-262 标准。 ECMAScript 是标准, JavaScript 是标准的具体实现。

3.2 JavaScript JAVA 比较


1. 出身不同

JavaScript 是 Netscape 公司的产品,前身是 LiveScript ;

Java 是 Sun 公司的产品,现在是 Oracle 公司的产品。

2. 结构思想不同

JavaScript 是基于对象,就是使用对象, JavaScript 不支持多态。

Java 是面向对象,三大特性 ( 封装,继承,多态 ) 缺一不可。

3. 执行方式不同

JavaScript 只需解释就可以执行

Java 需要先编译成字节码文件,再执行

4. 类型种类不同

JavaScript 是弱类型,一个变量可以存放任意类型的数据。

Java 是强类型, Integer 类型只能存放整形。

5. 命名相同

JavaScript 与 java 一样都区分大小写

历史故事:

JavaScript 更名之前, Java 已经开始流行, Netscape 借了一次东风,且非常成功。但 JavaScript

和 Java

除了都含有“ Java ”单词,没有任何关系。

JavaScript 和 Java 好比:雷锋和雷峰塔。 都发音为: leifeng ,但本质完全不同

3.3 语句


3.3.1 if 语句


if 语句是逻辑判断语句,最常用的语句之一。

if 语句的语法 1

image.png

if 语句的语法 2

image.png

3.3.2 switch 语句


switch 语句

image.png

3.3.3 while 语句


while 语句是循环语句。

image.png

3.3.4 for 语句


for 循环

image.png

3.3.5 instanceof 运算符


在使用 typeof 运算符时采用引用类型存储值会出现一个问题,无论引用的是什么类型的对象,它都返回 "object" 。 ECMAScript 引入了另一个 Java 运算符 instanceof 来解决这个问题。

instanceof 运算符与 typeof 运算符相似,用于识别正在处理的 对象的类型 。与 typeof 方法不同的是,instanceof 方法要求开发者明确地确认对象为某特定类型。

 例如:

image.png

相关文章
|
16天前
|
JavaScript 前端开发
如何在 JavaScript 中使用 __proto__ 实现对象的继承?
使用`__proto__`实现对象继承时需要注意原型链的完整性和属性方法的正确继承,避免出现意外的行为和错误。同时,在现代JavaScript中,也可以使用`class`和`extends`关键字来实现更简洁和直观的继承语法,但理解基于`__proto__`的继承方式对于深入理解JavaScript的面向对象编程和原型链机制仍然具有重要意义。
|
20天前
|
Web App开发 JavaScript 前端开发
如何确保 Math 对象的方法在不同的 JavaScript 环境中具有一致的精度?
【10月更文挑战第29天】通过遵循标准和最佳实践、采用固定精度计算、进行全面的测试与验证、避免隐式类型转换以及持续关注和更新等方法,可以在很大程度上确保Math对象的方法在不同的JavaScript环境中具有一致的精度,从而提高代码的可靠性和可移植性。
|
19天前
|
缓存 JavaScript UED
js中BOM中的方法
【10月更文挑战第31天】
|
20天前
|
JavaScript 前端开发 图形学
JavaScript 中 Math 对象常用方法
【10月更文挑战第29天】JavaScript中的Math对象提供了丰富多样的数学方法,涵盖了基本数学运算、幂运算、开方、随机数生成、极值获取以及三角函数等多个方面,为各种数学相关的计算和处理提供了强大的支持,是JavaScript编程中不可或缺的一部分。
|
1月前
|
存储 JavaScript 前端开发
JavaScript 对象的概念
JavaScript 对象的概念
38 4
|
1月前
|
缓存 JavaScript 前端开发
JavaScript中数组、对象等循环遍历的常用方法介绍(二)
JavaScript中数组、对象等循环遍历的常用方法介绍(二)
34 1
|
1月前
|
存储 JavaScript 前端开发
js中函数、方法、对象的区别
js中函数、方法、对象的区别
16 2
|
1月前
|
JavaScript 前端开发 Unix
Node.js 全局对象
10月更文挑战第5天
29 2
|
1月前
|
JavaScript 前端开发 大数据
在JavaScript中,Object.assign()方法或展开语法(...)来合并对象,Object.freeze()方法来冻结对象,防止对象被修改
在JavaScript中,Object.assign()方法或展开语法(...)来合并对象,Object.freeze()方法来冻结对象,防止对象被修改
21 0
|
1月前
|
JavaScript 前端开发 索引
JavaScript中数组、对象等循环遍历的常用方法介绍(一)
JavaScript中数组、对象等循环遍历的常用方法介绍(一)
23 0