BOM中各对象属性和方法

最新推荐文章于 2022-10-13 16:26:58 发布

weixin_34101229

最新推荐文章于 2022-10-13 16:26:58 发布

阅读量275

点赞数 1

文章标签： python javascript ViewUI

原文链接：https://my.oschina.net/yxmBetter/blog/829648

版权

2019独角兽企业重金招聘Python工程师标准>>>

了解了ECMAScript和DOM，接下来，我们就认识一下BOM吧。

BOM

浏览器对象模型

Javascript模型

window对象

window对象是JavaScript中的顶级对象
所有定义在全局作用域中的变量、函数都会变成window对象的属性和方法
window对象下的属性和方法调用的时候可以省略window
浏览器里所有的属性和方法都是属于window对象的
- alert() //不同浏览器中的外观是不一样的
- confirm();//true确定,false取消
- prompt() //不推荐使用
打开窗口：window.open(url,target,param)以前常用,现在几乎不用了，用层代替
- url 要打开的地址
- target新窗口的位置 _blank _self _parent(父框架)
- param 新窗口的一些设置
- 返回值，新窗口的句柄
关闭窗口：window.close()
移动到某个位置：window.moveTo()
每次移动距离：window.moveBy()
改变大小：window.resizeTo()
每次改变：window.resizeBy()
onload（页面加载后触发）---文档加载完毕
- 网页加载完毕时触发，浏览器是一边下载文档、一边解析执行，可能会出现JavaScript执行时需要操作某个元素，这个元素还没有加载，如果这样就要把操作的代码放到body的onload事件中，或者可以把JavaScript放到元素之后。元素的onload事件是元素自己加载完毕时触发，body onload才是全部加载完成。
window.控件Id（不建议使用）
document.getElementById(“控件Id”);
onunload（页面卸载后触发）
- 网页关闭（或者离开）后触发。//刷新页面的时候、关闭选项卡的时候（多个选项卡）
onbeforeunload（页面卸载前触发）
- 在网页准备关闭（或者离开）前触发。//注意浏览器缓存
- <body οnbefοreunlοad=“return ‘真的要放弃发帖退出吗?’; ”>显示的文字随浏览器版本而有差异。// =“window.event.returnValue=‘’只兼容IE

定时器

var intervalId= window.setInterval(code,delay)//每隔一段时间执行指定的代码
- 第一个参数：指定的代码字符串
- 第二个参数：时间间隔（毫秒数）
window.clearInterval(intervalId);//停止计时器
- 间隔时间执行，不是特别精确
延迟执行
var timeId=window.setTimeout也是定时执行，但是不像setInterval那样是重复的定时执行只执行一次，
window.clearTimeout(timeId)也是清除定时。

location对象

window.location
- location相当于浏览器地址栏
- 可以将url解析成独立的片段
location对象的属性
- href
- hash 返回url中#后面的内容，包含#
- host 主机名，包括端口
- hostname 主机名
- pathname url中的路径部分
- protocol 协议一般是http、https
- search 查询字符串

window.location.href="http://www.baidu.com";
console.log(window.location.hash);
console.log(window.location.host);
console.log(window.location.hostname);
console.log(window.location.pathname);
console.log(window.location.port);
console.log(window.location.protocol);
console.log(window.location.search);

location对象的方法 -location.assign() 改变浏览器地址栏的地址，并记录到历史中（会保存历史记录，可点击后退）
- 设置location.href属性就会调用assign()。一般使用location.href 进行页面之间的跳转（会保存历史记录，可点击后退）
- location.replace() 替换浏览器地址栏的地址，不会记录到历史中
- location.reload() 重新加载

navigator对象

window.navigator 的一些属性可以获取客户端(浏览器)的一些信息(userAgent,platform)

console.log(window.navigator.userAgent);//获取客户端的信息(系统的信息,浏览器的信息)
console.log(window.navigator.platform);//获取到系统信息

history对象

历史记录管理
后退
- history.back()
- history.go(-1)
前进
- history.forward()
- history.go(1)
页面中很少有按钮或者操作，让用户点击然后后退或者前进，在某些公司的内部的管理的系统中会用到,OA。

//旧页面
//先跳转到别的页面,从别的页面后退回来,就会有前进的记录了
document.getElementById("btnTiaoZhuan").onclick=function () {
    window.location.href="test.html";
};
//浏览器中必须有过跳转的记录
document.getElementById("btnGo").onclick=function () {
    window.history.forward();//前进
};

//新页面：test.html
document.getElementById("btnHou").onclick=function () {
    window.history.back();//后退
};

怎么样，BOM基础是不是都已经学会了呢？如果不会可以先收藏，使用的时候找一下就可以啦。

转载于:https://my.oschina.net/yxmBetter/blog/829648