BOM模型
1. BOM（Browser Object Model）
BOM是浏览器提供给JavaScript的编程接口，它允许JavaScript与浏览器进行交互。通过BOM，JavaScript可以控制浏览器的行为，例如打开和关闭窗口、跳转到新的URL、获取屏幕信息等。
例子：
假设你想通过JavaScript打开一个新的浏览器窗口，并在其中加载一个网页，你可以使用以下代码：
window.open('https://www.example.com', '_blank');
这里，window.open是BOM提供的一个方法，'https://www.example.com'是你想打开的网页的URL，'_blank'表示在新的窗口中打开。
2. window对象
window是BOM的核心对象，它是浏览器中所有对象的顶层对象。所有的全局变量和函数实际上都是window对象的属性和方法。
例子：
如果你想在当前窗口关闭后打开一个新的窗口，可以使用：
window.close(); // 关闭当前窗口
window.open('https://www.example.com'); // 在当前窗口打开新网页
这里，window.close()关闭当前窗口，而window.open()则在当前窗口打开一个新的网页。
3. navigator对象
navigator对象包含了关于浏览器本身的信息。
例子：
如果你想检测用户的浏览器是否支持某个特定的特性，可以检查navigator.userAgent：
if (navigator.userAgent.includes('Chrome')) {
// 执行一些Chrome特有的操作
}
这里，navigator.userAgent返回了用户代理字符串，我们通过includes方法检查它是否包含'Chrome'，从而判断用户是否使用的是Chrome浏览器。
4. location对象
location对象提供了与当前页面的URL相关的信息和操作方法。
例子：
如果你想在用户点击一个按钮后跳转到另一个页面，可以这样做：
document.getElementById('myButton').addEventListener('click', function() {
window.location.href = 'https://www.example.com';
});
这里，我们给ID为myButton的元素添加了一个点击事件监听器，当按钮被点击时，window.location.href被设置为新的URL，从而实现页面跳转。
5. document对象
document对象代表了整个HTML页面，通过document对象，你可以访问和操作页面中的元素。
例子：
如果你想在页面上动态添加一个段落，可以这样做：
var newParagraph = document.createElement('p');
newParagraph.textContent = '这是新添加的段落';
document.body.appendChild(newParagraph);
这里，document.createElement('p')创建了一个新的<p>元素，textContent设置了它的文本内容，appendChild方法将这个新元素添加到了<body>元素中。
6. history对象
history对象包含了用户在浏览器中访问过的页面的历史记录。
例子：
如果你想模拟浏览器的后退按钮，可以使用：
history.back();
这行代码会让用户回到他们之前访问的页面。
7. screen对象
screen对象提供了有关用户屏幕的信息。
例子：
如果你想根据屏幕大小调整网页布局，可以这样做：
if (screen.width < 600) {
// 执行一些适配小屏幕的操作
}
这里，我们检查screen.width是否小于600像素，如果是，就执行一些适配小屏幕的操作。