跳转至

10.操作BOM对象

浏览器介绍

JavaScript和浏览器关系? JavaScript诞生就是为了能够让他在浏览器中运行! BOM:浏览器对象模型

  • IE6~11
  • Chrome
  • Safari
  • FireFox

三方

  • QQ浏览器
  • 360浏览器

window

window代表浏览器窗口

Text Only
window.innerHeight
245
window.innerWidth
911
window.outerHeight
905
window.outerWidth
923 

Navigator封装了浏览器信息

大多数时候不会使用navigator对象,因为会被认为修改,不建议根据这个的相关属性编写代码

Text Only
navigator.appName
"Netscape"
navigator.appVersion
"5.0 (Windows)"
navigator.userAgent
"Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:121.0) Gecko/20100101 Firefox/121.0"
navigator.platform
"Win32" 

screen

屏幕尺寸

Text Only
screen.width
screen.height

location(重要)

location代表当前页面的URL信息

Text Only
location.host
"www.baidu.com"
location.href
"https://www.baidu.com/"
location.protocol
"https:"

location.reload()//刷新网页
location.assign("https://www.bilibili.com")//设置新地址

document

document代表当前页面,HTML,DOM文档树

Text Only
document.title
"哔哩哔哩 (゜-゜)つロ 干杯~-bilibili" 

获取具体的文档树节点

Text Only
<body>
    <dl id="app">
        <dt>Java</dt>
        <dt>JavaScript</dt>
        <dt>Vue</dt>
    </dl>
</body>

image-20240113203022016

截取cookie

Text Only
document.cookie

劫持cookie原理

恶意人员会获取用户cookie上传他的服务器进行操作

服务器端可以设置cookie,httpOnly

history(不建议)

Text Only
history.back()//后退
history.forward()//前进