学习javaScript必知必会(5)~BOM模型、定时器原理、清除定时器

简介: 学习javaScript必知必会(5)~BOM模型、定时器原理、清除定时器

1、BOM:浏览器对象模型:

网页是由window对象和window对象的子级对象构成的树形模型(BOM模型)


2、简单介绍一下window的子对象:

document、location、navigation、screen、history、我们自定义创建的全局变量和函数都是window的子对象


□ window对象(浏览器对象)常用的方法:

alert(message) 消息框

prompt(message, [,defstr]) 输入框

confirm(message)

open(url,[, name,[, features]])

close()

blur()

focus()

print()

moveBy(x, y) 相对移动
moveTo(x, y) 绝对移动

resizeBy(x, y)

resizeTo(x, y)

scrollBy(x, y) 相对滚动
scrollTo(x, y) 绝对滚动

setTimeout(表达式, 毫秒) 定时器,只执行一次

setInterval(表达式, 毫秒) 定时器,循环执行

clearTimeout(表达式, 毫秒) 清除定时器


□ location 地址栏对象

host 主机名

port 端口号

href 完整的url信息

pathname 路径地址

protocol 协议

search 查询字符串

assign(url) 页面跳转


□ navigator 浏览器信息对象

appCodeName

appName 浏览器名称

appVersion 版本

platform 操作系统

onLine 是否在线

cookieEnabled 是否支持cookie


□ screen 屏幕信息对象

availHeight 可用高度(除 Windows 任务栏之外)

availWidth可用宽度

height高度

width宽度

colorDepth 颜色


□ history 历史对象 (history对象包含了用户在浏览器窗口访问过的url)

back() 加载历史列表中的前一个 URL(如果存在)。

forward() 加载历史列表中的下一个 URL。


□ document 文档对象:

linkColor 超链接颜色

alinkColor 点击链接作用过程中的颜色

vlinkColor 点击链接后的颜色

bgColor 背景颜色

fgColor 字体颜色

title 标题


getElementById(‘id’); 通过id属性获取某个dom元素

getElementsByName(‘name’); 通过name属性获取dom元素数组

getElementsByTagName(‘name’); 通过标签名获取dom元素数组


✿ 3、定时器原理:

当程序执行到setTimeout函数(setTimeout函数的返回值就是定时器对象)时,向系统抛出一个定时器对象,然后指定时间到达,定时器对象执行指定语句,

然后定时器对象(timer)消失


✿4、清除定时器:

var timer = setTimeout(表达式, 毫秒); //设置定时器(setTimeout函数返回值就是定时器对象)
clearTimeout(timer); //清除定时器
目录
相关文章
|
3月前
|
自然语言处理 JavaScript 前端开发
深入理解JavaScript中的闭包:原理与实战
【10月更文挑战第12天】深入理解JavaScript中的闭包:原理与实战
|
2月前
|
缓存 JavaScript UED
js中BOM中的方法
【10月更文挑战第31天】
|
2月前
|
JavaScript 前端开发 API
Vue.js响应式原理深度解析:从Vue 2到Vue 3的演进
Vue.js响应式原理深度解析:从Vue 2到Vue 3的演进
101 17
|
2月前
|
缓存 前端开发 JavaScript
JavaScript前端路由的实现原理及其在单页应用中的重要性,涵盖前端路由概念、基本原理、常见实现方式
本文深入解析了JavaScript前端路由的实现原理及其在单页应用中的重要性,涵盖前端路由概念、基本原理、常见实现方式(Hash路由和History路由)、优点及挑战,并通过实际案例分析,帮助开发者更好地理解和应用这一关键技术,提升用户体验。
108 1
|
2月前
|
Web App开发 JavaScript 前端开发
如何学习JavaScript?
如何学习JavaScript?
59 5
|
2月前
|
监控 JavaScript 算法
深度剖析 Vue.js 响应式原理:从数据劫持到视图更新的全流程详解
本文深入解析Vue.js的响应式机制,从数据劫持到视图更新的全过程,详细讲解了其实现原理和运作流程。
|
2月前
|
JavaScript 前端开发 索引
JavaScript学习第二章--字符串
本文介绍了JavaScript中的字符串处理,包括普通字符串和模板字符串的使用方法及常见字符串操作方法如`charAt`、`concat`、`endsWith`等,适合前端学习者参考。作者是一位热爱前端技术的大一学生,专注于分享实用的编程技巧。
38 2
|
2月前
|
存储 JavaScript 前端开发
JavaScript学习第一章
本文档介绍了JavaScript的基础知识,包括其在网页中的作用、如何通过JavaScript动态设置HTML元素的CSS属性,以及JavaScript中的变量类型(`var`、`let`、`const`)和数据类型(基本数据类型与引用数据类型)。通过实例代码详细解释了JavaScript的核心概念,适合初学者入门学习。
61 1
|
2月前
|
JavaScript 前端开发
深入理解Node.js中的异步编程模型
【10月更文挑战第39天】在Node.js的世界里,异步编程是核心所在,它如同自然界的水流,悄无声息却又无处不在。本文将带你探索Node.js中异步编程的概念、实践以及如何优雅地处理它,让你的代码像大自然的流水一样顺畅和高效。
|
3月前
|
前端开发 JavaScript
深入理解JavaScript中的事件循环(Event Loop):从原理到实践
【10月更文挑战第12天】 深入理解JavaScript中的事件循环(Event Loop):从原理到实践
52 1