JavaScript——BOM

最新推荐文章于 2024-11-17 22:31:08 发布
最新推荐文章于 2024-11-17 22:31:08 发布
阅读量584 收藏 1
点赞数
文章标签： 前端 javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/m0_56783154/article/details/123311718
版权

目录

JavaScript——BOM

1. BOM概述

BOM（Browser Object Model）即浏览器对象模型，它提供了独立于内容而与浏览器窗口进行交互的对象，其核心对象是window
BOM由一系列相关的对象构成，并且每个对象都提供了很多的方法和属性
BOM缺乏标准，JS语法的标准化组织是ECMA，DOM的标准化组织是W3C，BOM最初是NetScape浏览器标准的一部分

在这里插入图片描述
在这里插入图片描述

2. window对象的常见事件

2.1 页面加载事件

在这里插入图片描述
window.onload是窗口（页面）加载事件，当文档内容（包括图像、脚本文件、CSS文件等）完全加载完成才触发该事件
在这里插入图片描述
DOMContentLoaded仅当DOM加载完成，不包括样式表，图片和flash等等
如果页面图片很多，从用户访问到onload触发可能需要很长时间，交互效果就不能实现，必然影响用户体验，此时用DOMContentLoaded事件比较合适

2.2 调整窗口大小事件

在这里插入图片描述

在这里插入图片描述

3. 定时器

3.1 setTimeout

在这里插入图片描述

3.2 clearTimeout

在这里插入图片描述

4. JS执行机制

4.1 this指向

this的指向在函数定义的时候是确定不了的，只有函数执行的时候才能确定this到底指向谁，一般情况下this的最终指向是那个调用它的对象
现阶段，我们先了解几个this指向

  1. 全局作用域或者普通函数中this指向全局对象window（注意定时器里面的this指向window）
  2. 方法调用中，谁调用了这个方法，this就指向谁
  3. 构造函数中，this指向构造函数的实例

4.2 JS是单线程

在这里插入图片描述

4.3 同步和异步

在这里插入图片描述
在这里插入图片描述

4.4 JS执行机制

在这里插入图片描述
在这里插入图片描述

5. location对象

5.1 什么是location对象

在这里插入图片描述

5.2 URL

在这里插入图片描述

5.3 常用属性

在这里插入图片描述

5.4 常用方法

在这里插入图片描述

6. navigator对象

在这里插入图片描述

7. history对象

在这里插入图片描述

专注且自信
关注
JavaScript——BOM（笔记）
qq_49066502的博客
05-21 434
JavaScript—BOM的基本操作，基于黑马程序员书写的学习笔记
JavaScript 系列笔记——BOM（叄）
浮幻的博客
08-13 1212
JavaScript 系列笔记——BOM，确定不点进来瞧瞧？
JavaScript —— BOM
lime2019的博客
05-14 237
浏览器对象模型1. BOM简介2. BOM对象3. Window对象4. Navigator对象5. Screen对象6. Location对象7. History对象 1. BOM简介 BOM（Browser Object Model，浏览器对象模型）是用于描述这种对象与对象之间层次关系的模型，浏览器对象模型提供了独立于内容的、可以与浏览器窗口进行互动的对象结构。BOM由多个对象组成，其中代表浏览器窗口的Window对象是BOM的顶层对象，其他对象都是该对象的子对象。 BOM并没有相关标准，每一个浏览
JavaScript——BOM编程
Cherubim_Angels的博客
04-21 212
文章目录一、BOM是什么？二、BOM对象1.BOM对象模型2.读入数据总结 一、BOM是什么？ BOM(Browser Object Model)是指浏览器对象模型，可以对浏览器窗口进行访问和操作。使用BOM，开发者可以移动窗口、改变状态栏中的文本以及执行其他与页面内容不直接相关的动作。 二、BOM对象 1.BOM对象模型 下述两个对象有特殊双重身份：document对象既是BOM顶级对象window的一个属性，也是DOM模型中的顶级对象：location对象既是window对象的属性，同时也是docum
JavaScript——BOM阶段
我爱睡觉oo——的博客
08-09 460
基本案例
JavaScript——BOM 浏览器对象模型
weixin_61920612的博客
03-27 289
JavaScript——BOM 浏览器对象模型
JavaScript——BOM（浏览器对象模型）
zg0601的博客
12-03 789
本文记录了JavaScript中BOM（浏览器对象模型）的基础知识，其中包括BOM简介，window对象，location对象，navigator对象和history对象的相关属性和常用方法。
JavaScript——BOM浏览器对象模型
Melonico的博客
06-25 657
BOM 什么是BOM BOM(Browser Object Model) 是指浏览器对象模型，将浏览器的各个组成部分封装为对象 组成 一. 窗口对象 Window Window 对象表示浏览器中打开的窗口 ○ 方法 - 弹出框相关 ① alert()：显示带有一条指定消息和一个 OK 按钮的警告框 alert("Hello,world!"); ② confirm()：显示一个带有指定消息和 OK 及取消按钮的对话框 confirm("确定吗？"); 如果用户点击确定按钮，该方法会返回true，如果点击
JavaScript——BOM操作：定时器
qq_41929578的博客
10-10 186
js 定时器有以下两个方法： setInterval() ：按照指定的周期（以毫秒计）来调用函数或计算表达式。方法会不停地调用函数，直到 clearInterval() 被调用或窗口被关闭。 setTimeout() ：在指定的毫秒数后调用函数或计算表达式。 setInterval() 语法 setInterval(code,millisec,lang) 参数 描述 code 必需。要调用的函数或要执行的代码串。 millisec 必须。周期性执行或调用 code 之间的时间间隔
javascript——BOM
can_Sunshine的博客
12-26 366
1、重绘：样式改变即为重绘 回流：当大小改变时即为回流。 回流一定重绘，重绘不一定回流。 回流有可能改变其他元素的位置，会大量的重绘，所以占内存较多。 2、加载协议： http：超文本传输协议，默认脑端口号80 https：加密。 由浏览器决定，选择加载速度较快的。 3、定时器： setInterval（function(){},1000） ：间隔调用 clearInterval
JavaScript——BOM的理解
wang1664178416的博客
03-08 400
BOM浏览器对象模型，提供了独立于内容与浏览器窗口进行交互的对象。作用就是跟浏览器做一些交互效果，比如页面的后退，前进，刷新，浏览器窗口发生变化、滚动条的滚动。
Javascript高级编程学习笔记27——BOM1window对象1.docx
07-05
JavaScript高级编程的学习中，BOM（Browser Object Model）占据着重要的地位，因为它使得JavaScript能够与浏览器进行交互。在浏览器环境中，JavaScript的核心语法是ECMAScript，但BOM提供了与浏览器功能交互的一系列...
JS学习笔记十一——BOM 操作
weixin_43328954的博客
02-07 1831
BOM 操作 BOM 操作是指操作浏览器相关的内容，其操作范畴包括了：浏览器滚动条、页面历史会退和前进、开启新标签页和关闭当前标签页等。 BOM 全名为 Browser Object Model，是一整套操作浏览器相关内容的属性和方法，这些方法可以用于操作浏览器历史记录、滚动条、页面跳转、标签页的开启和关闭等。 BOM 操作内容： 获取浏览器的可视窗口尺寸 可视窗口指的是除控制台和浏览器头部外，可显示页面内容的窗口位置，其中包含了浏览器滚动条。
react 如何修改弹出的modal的标题
最新发布
datouniao1的博客
11-17 183
理解：Modal的title属性可以是一个标签。
前端文件优化
weixin_62668406的博客
11-15 705
对于一张100*100像素的图片来说，图像上有 10000 个像素点，如果每个像素的值是 RGBA 存储的话，那么也就是说每个像素有 4 个通道，每个通道 1 个字节（8 位 = 1个字 节），所以该图⽚⼤⼩⼤概为 39KB（10000 * 1 * 4 / 1024）。但是在实际项⽬中，⼀张图⽚可能并不需要使⽤那么多颜⾊去显示，我们可以通过减少每个 像素的调⾊板来相应缩⼩图⽚的⼤⼩。
springboot整合websocket实现复制目录进度推送
前人栽树，后人乘凉。
11-14 404
/ 替换为你的WebSocket地址。启动Spring Boot应用程序，然后访问前端页面并触发文件复制操作。例如，通过浏览器访问。你应该能够在前端看到实时的复制进度。创建一个控制器来触发复制操作。
React中事件绑定和Vue有什么区别？
m0_75074819的博客
11-17 276
React使用事件代理（Event Delegation）技术，将所有事件监听器绑定到document上，而不是直接绑定到具体的DOM元素上。：React将所有原生DOM事件封装成合成事件，通过统一的接口暴露给开发者。：Vue提供了丰富的事件修饰符（如.stop、.prevent等），方便开发者处理复杂的事件逻辑。如果你在类组件中使用事件处理函数，通常需要显式绑定 this，或者使用箭头函数来自动绑定。：Vue通过指令（如v-on）来绑定事件，指令内部会处理事件的监听和分发。因此，不需要额外的绑定。
使用Web Components构建模块化Web应用
qq_36287830的博客
11-16 869
允许开发者定义自己的 HTML 元素。Shadow DOM：提供了一种将 DOM 树与文档的其余部分隔离的方法，增强了封装性。：允许开发者定义可重复使用的 HTML 模板。（已废弃）：允许开发者导入 HTML 文档中的 Web Components。自定义元素是 Web Components 的核心部分，允许开发者创建自己的 HTML 元素。自定义元素需要注册到全局的对象中。super();
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值