当前位置: 首页 > news >正文

JavaScript Window对象

一、BOM(浏览器对象模型)

window对象是一个全局对象,也可以说是JavaScript中的顶级对象。

像document、alert()、console.log()这些都是window的属性,基本BOM的属性和方法都是window的。

所有通过var定义在全局作用域中的变量、函数都会变成window对象的属性和方法。

window对象下的属性和方法调用的时候可以省略window。


二、定时器 - 延时函数

JS中内置的一个用来让代码延迟执行的函数,叫setTimeout。

setTimeout仅仅只执行一次,所以可以理解为就是把一段代码延迟执行,平时省略window。

清除延时函数:

例子:5秒钟之后广告自动消失


三、JS执行机制

JavaScript 语言的一大特点就是单线程,也就是说,同一个时间只能做一件事。

这是因为Javascript 这门脚本语言诞生的使命所致。javaScript 是为处理页面中用户的交互,以及操作DOM 而诞生的。比如我们对某个 DOM 元素进行添加和删除操作,不能同时进行。应该先进行添加,之后再删除。

单线程就意味着,所有任务需要排队,前一个任务结束,才会执行后一个任务。这样所导致的问题是: 如果 JS 执行的时间过长,这样就会造成页面的渲染不连贯,导致页面渲染加载阻塞的感觉。

1、先执行执行栈中的同步任务。

2、异步任务放入任务队列中。

3、一旦执行栈中的所有同步任务执行完毕,系统就会按次序读取任务队列中的异步任务,于是被读取的异步任务结束等待状态,进入执行栈,开始执行。

由于主线程不断的重复获得任务、执行任务、再获取任务、再执行,所以这种机制被称为事件循环(event loop)。


四、location对象

location的数据类型是对象,它拆分并保存了URL地址的各个组成部分。

常用属性和方法:
herf属性获取完整的URL地址,对其赋值时用于地址的跳转。

例子:5秒钟后自动跳转页面

search属性获取地址中携带的参数,网址的符号?后面部分。

hash属性获取地址中的哈希值,网址的符号#后面的部分

reload方法用来刷新当前页面,传入参数true时表示强制刷新。


五、navigator对象

navigator的数据类型是对象,该对象下记录了浏览器自身的相关信息。

常用属性和方法:

通过userAgent检测浏览器的版本及平台


六、history对象

history的数据类型是对象,主要管理历史记录,该对象与浏览器地址栏的操作相对应,如前进、后退、历史记录等。

常用属性和方法:

history对象一般在实际开发中比较少用,但是会在一些OA办公系统中见到。

相关文章:

  • 如何让大模型更聪明?提升AI智能的关键策略
  • Cocos Creator 编辑器的数据绑定详解
  • C#同花顺下单 模拟操作版接口实现
  • 【Qt 学习笔记】Qt窗口 | 菜单栏 | QMenuBar的使用及说明
  • Python怎样将PDF拆分成多个文件
  • 对gRPC中常见的 grpc::CreateChannel()这个类所创建的对象所包含的属性做详细介绍
  • 力扣496. 下一个更大元素 I
  • 【数据库基础-mysql详解之索引的魅力(N叉树)】
  • sheng的学习笔记-docker部署Greenplum
  • 会话机制:Session
  • Vue3实战笔记(46)—Vue 3高效开发定制化Dashboard的权威手册
  • Python库之`lxml`的高级用法深度解析
  • Python开发Android手机APP
  • Java入门基础学习笔记42——常用API
  • Python Flask 图片上传与下载
  • 2017-09-12 前端日报
  • ECMAScript入门(七)--Module语法
  • es的写入过程
  • FineReport中如何实现自动滚屏效果
  • PhantomJS 安装
  • Python代码面试必读 - Data Structures and Algorithms in Python
  • WinRAR存在严重的安全漏洞影响5亿用户
  • 爱情 北京女病人
  • 持续集成与持续部署宝典Part 2:创建持续集成流水线
  • ------- 计算机网络基础
  • 如何选择开源的机器学习框架?
  • 入门级的git使用指北
  • 为视图添加丝滑的水波纹
  • 用element的upload组件实现多图片上传和压缩
  • Nginx实现动静分离
  • ​ 无限可能性的探索:Amazon Lightsail轻量应用服务器引领数字化时代创新发展
  • ​LeetCode解法汇总2670. 找出不同元素数目差数组
  • ​如何在iOS手机上查看应用日志
  • (2)nginx 安装、启停
  • (el-Date-Picker)操作(不使用 ts):Element-plus 中 DatePicker 组件的使用及输出想要日期格式需求的解决过程
  • (Qt) 默认QtWidget应用包含什么?
  • (非本人原创)我们工作到底是为了什么?​——HP大中华区总裁孙振耀退休感言(r4笔记第60天)...
  • (力扣题库)跳跃游戏II(c++)
  • (免费分享)基于springboot,vue疗养中心管理系统
  • (十二)springboot实战——SSE服务推送事件案例实现
  • (详细版)Vary: Scaling up the Vision Vocabulary for Large Vision-Language Models
  • (转)AS3正则:元子符,元序列,标志,数量表达符
  • (转)菜鸟学数据库(三)——存储过程
  • (转载)虚函数剖析
  • .Net - 类的介绍
  • .Net 6.0 处理跨域的方式
  • .NET 8 编写 LiteDB vs SQLite 数据库 CRUD 接口性能测试(准备篇)
  • .net Signalr 使用笔记
  • .net 连接达梦数据库开发环境部署
  • .Net6使用WebSocket与前端进行通信
  • .NET使用HttpClient以multipart/form-data形式post上传文件及其相关参数
  • .NET中分布式服务
  • ??Nginx实现会话保持_Nginx会话保持与Redis的结合_Nginx实现四层负载均衡
  • @EnableWebSecurity 注解的用途及适用场景
  • @reference注解_Dubbo配置参考手册之dubbo:reference