JavaScript操作BOM对象

简介: JavaScript操作BOM对象

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

二、BOM实现的功能:

1.弹出新的浏览器窗口

2.移动关闭浏览器窗口以及调整窗口的大小。

3.页面的前进、后退。

三、Window常用的属性:

1.history:有关客户访问过的URL信息

2.location:有关当前URL信息

语法:window.属性名 = “属性值”,eg:window.location=“http://www.bdqn.club”;

四、window里面常用的方法:

1.prompt:显示可以输入的对话框

2.alert:弹出框

3.confim:弹出一个确认对话框

4.close:关闭浏览器窗口(IE下面可以直接关闭,但是其他浏览器关闭不了非模式打开的窗口)

5.open:打开浏览器窗口

6.setTimeout:在指定的时间之后调用函数

7.setInterval:在指定周期内调用函数

注意:setTimeout和setInterval的区别就是,第一个在5s之后执行函数,第二个则是每隔5s执行一次函数

五、弹出窗体open

语法:

window.open(“弹出窗体的URL地址”,“窗体名称”,“窗体属性1,窗体属性2”)

eg:window.open(“index.html”,“标题”,“higth=500,width=500”);

六、关闭窗口:

window.close();

七、window里常用的事件:

1.onload():加载事件

2.onmouseover():鼠标移动到某元素上的事件

3.onclick():单击事件

4.onchange():改变事件

八、history对象:

1.back():加载history对象列表的前一个url

2.forword():加载history对象列表的后一个url

3.go():里面是一个数字参数,如果是1,则去下一个url,如果是-1,则去上一个url

九、location对象:

1.host:主机名和端口号

2.hostname:主机名

3.href:返回完整的url

4.reload():重新加载当前文档

十、document对象:

1.referrer:返回载入当前文档的URL

2.Url:返回当前文档的url

十一、当不是访问超链接的时候,document.referrer返回的是空字符串(" "),如果是通过超链接访问的话,document.referrer返回的不是空。

十二、document常用的方法:

1.getElementById():获取指定的id元素

2.getElementsByName():获取指定的name元素

3.getElementsByTagName():获取指定的标签名称元素

4.write():向文档中写入信息。

十三、JavaScript的内置对象:

1.Date():用于操作日期和时间

var date = new Date();

(1)获取当前年:getFullYear();

(2)获取当前月:getMonth();

(3)获取当前日:getDate();

(4)获取当前小时:getHours();

(5)获取当前分钟:getMinutes();

(6)获取当前秒:getSeconds();

2.Array():数组的关键词

3.String():用于支持对字符串的处理

4.Math():数学函数

(1)ceil:对数进行上舍入,eg:ceil(1.2),返回2;

(2)floor:对数进行下舍入,eg:floor(1.2),返回1;

(3)random:随机数,比如1-10的随机数,Math.random()*10;

十四、定时函数:

1.setTimeout(“调用的事件”,时间);

eg:5秒之后弹出来一个框,setTimeout(“alert(‘弹框’)”,5000);

2.setInterval(“调用的事件”,时间);

eg:每隔5秒弹出一个框:setInterval(“alert(‘弹框’)”,5000);

目录
相关文章
|
3天前
|
存储 JavaScript 索引
js开发:请解释什么是ES6的Map和Set,以及它们与普通对象和数组的区别。
ES6引入了Map和Set数据结构。Map的键可以是任意类型且有序,与对象的字符串或符号键不同;Set存储唯一值,无重复。两者皆可迭代,支持for...of循环。Map有get、set、has、delete等方法,Set有add、delete、has方法。示例展示了Map和Set的基本操作。
17 3
|
16天前
|
JavaScript
JS 获取对象数据类型的键值对的键与值
JS 获取对象数据类型的键值对的键与值
|
5天前
|
JavaScript 前端开发 UED
深入解析JavaScript原生操作DOM技术
【4月更文挑战第22天】本文深入探讨JavaScript原生DOM操作技术,包括使用`getElement*`方法和CSS选择器获取元素,借助`createElement`与`appendChild`动态创建及插入元素,修改元素内容、属性和样式,以及删除元素。通过掌握这些技术,开发者能实现页面动态交互,但应注意避免过度操作DOM以优化性能和用户体验。
|
5天前
|
JavaScript 前端开发 开发者
JavaScript中的错误处理:try-catch语句与错误对象
【4月更文挑战第22天】JavaScript中的错误处理通过try-catch语句和错误对象实现。try块包含可能抛出异常的代码,catch块捕获并处理错误,finally块则无论是否出错都会执行。错误对象提供关于错误的详细信息,如类型、消息和堆栈。常见的错误类型包括RangeError、ReferenceError等。最佳实践包括及时捕获错误、提供有用信息、不忽略错误、利用堆栈信息和避免在finally块中抛错。
|
10天前
|
JavaScript
【Js】检查Date对象是否为Invalid Date
【Js】检查Date对象是否为Invalid Date
14 0
|
11天前
|
存储 JavaScript 前端开发
JavaScript的引用数据类型主要包括对象
【4月更文挑战第16天】JavaScript的引用数据类型主要包括对象
16 4
|
12天前
|
存储 JavaScript 前端开发
JavaScript DOM 操作:解释一下 cookie、sessionStorage 和 localStorage 的区别。
Cookie是服务器发送至客户端的文本信息,会随每个请求发送回服务器,适合控制会话状态但可能暴露隐私。SessionStorage仅在当前会话中存储数据,关闭浏览器后清除,适合临时存储如登录状态。LocalStorage则持久保存数据,即使关闭浏览器也不会清除,适用于存储长期设置。三种方式各有侧重,应按需求选择。
15 0
|
12天前
|
JavaScript 前端开发 安全
JavaScript DOM 操作:解释一下浏览器的同源策略。
**同源策略**是浏览器安全基石,它阻止脚本跨不同协议、域名或端口访问资源,防止恶意行为。例如,HTTP页面无法直接用JS获取HTTPS页面内容。**CORS**允许跨域请求,但需服务器配合设置,通过`document.domain`属性可配置,但仍受限于服务器配置。
14 4
|
16天前
|
JavaScript
js 字符串String转对象Object
该代码示例展示了如何将一个以逗号分隔的字符串(`'1.2,2,3,4,5'`)转换为对象数组。通过使用`split(',')`分割字符串并`map(parseFloat)`处理每个元素,将字符串转换成浮点数数组,最终得到一个对象数组,其类型为`object`。
|
存储 JavaScript 前端开发