BOM操作常用对象

[文章标题：BOM操作常用对象] [2020-12-30 11:32:00]

博文总目录

1. window对象

window.open("https://www.baidu.com");  
// 新开一个标签页，打开指定连接（需要浏览器允许，一般浏览器默认“拦截网页上的弹出式窗口”）

window.open("https://www.baidu.com","_blank","width=500,height=300,left=500,top=200");
// 参数：url  target  新开的窗体属性

window.close(); // 关闭当前窗口

2. window.screen对象

window的属性都是全局的，可以直接使用。

screen.width 	// 获取 屏幕 宽度
screen.height   // 获取 屏幕 高度

3. location

location.href // 获取当前页面的网址，也可以通过为其赋值跳转到指定页面。
location.reload();  // 刷新页面

4. history

history.back();	  // 返回上一个页面	
history.go(-1);   // 返回上一个页面

5. navigator

<script>
var str = "";
str += "<p>浏览器的代号："+ navigator.appCodeName +"</p>";
str += "<p>浏览器的名称："+ navigator.appName+"</p>";
str += "<p>浏览器的版本："+ navigator.appVersion+"</p>";
str += "<p>硬件平台："+ navigator.platform+"</p>";
str += "<p>用户代理："+ navigator.userAgent +"</p>";
str += "<p>启用Cookies："+navigator.cookieEnabled+"</p>";
document.write(str);
</script>

6. localStorage

localStorage["a"] = 1;
localStorage.b = 2;
localStorage.setItem("key",value);
localStorage.getItem("key");

localStorage：以键值对的形式存储数据，其存储的值都会转为字符串类型。

故而为了方便类型转换可以采用 JSON 转换存储。

localStorage.setItem("data",JSON.stringify([1,2,3,{name:"dodo",age:5}]));
var data = JSON.parse(localStorage.getItem("data"));

7. sessionStorage

功能和用法与localStorage一致，区别在于有效范围。

localStorage生命周期是永久，若不手动删除，其中的值会一直存在。sessionStorage生命周期为当前窗口或标签页。

不同页面间可以共享相同的 localStorage（域名要相同）；不同页面或标签页间无法共享sessionStorage的信息。

也就是说，若果某个数据仅在自己页面使用，且只需要临时存储，就用sessionStorage；否则，用localStorage。