认识BOM
BOM:浏览器对象模型(Browser Object Model)简称 BOM,由浏览器提供的用于处理文档之外的所有内容的其他对象
BOM主要包括以下的对象模型:
window:包括全局属性、方法,控制浏览器窗口相关的属性、方法
console.log(globalThis === window); // true
location:浏览器连接到的对象的位置(URL)
// 常见的属性
console.log(location.href); // 超链接URL
console.log(location.protocol); // 当前协议
console.log(location.host); // 主机地址
console.log(location.hash); // 哈希值
console.log(location.port); // 端口
console.log(location.pathname); // 路径
console.log(location.hostname); // 主机地址
console.log(location.search); // 查询字符串
// 常见的方法
location.assign('www.baidu.com') // 打开一个网页,可以进行返回
location.replace('www.baidu.com') // 打开一个网页,不可以进行返回
location.reload() // 重新加载页面,可以传入一个布尔类型
history:操作浏览器的历史
// 前端路由核心:修改url页面不刷新
history.back() // 返回上一级,等价于history.go(-1)
history.forward() // 前进下一页,等价于history.go(1)
history.go(2) // 前进2步
history.pushState() // 打开一个指定的地址
history.replaceState() // 打开一个新的地址,并且使用replace
JSON序列化
var obj = {
name: 'www',
age: 19,
friend: {
name: 'qq',
age: 20
}
}
var jsonObj = JSON.stringify(obj,function (key,value) {
// 将name的值全部转成wqq
if(key === 'name') {
return 'wqq'
}
return value
})
// 将obj对象进行序列化
localStorage.setItem('info',JSON.stringify(obj))
// 将字符串转为对象
localStorage.getItem(JSON.parse('info'))