一.windows对象
浏览器对象模型（BOM ：Browser Object Model）是JavaScript的组成之一
1.作用
器窗口进行交互的对象，使用浏览器对象模型可以实现与HTML的交互。它的作用是将相关的元素组织包装起来，成之一，它提供了独立于内容与浏览
如：
1.弹出新的浏览器窗口
2.移动、关闭浏览器窗口及调整窗口大小
3.在浏览器窗口中实现页面的前进、后退功能
2.常用属性
1.history 有关客户访问过的URL的信息
2.location 有关当前URL的信息
3.screen 只读属性，包含有关客户端显示屏的信息
3.语法格式
window.属性名=“属性值”
举例
1.history 对象
back （） 前一个URL
forward （）后一个URL
go （） 返回完整的URL
2.location 对象
host ： 设置或返回主机名和当前URL的端口号
hostname : 设置或返回当前URL的主机名
href： 设置或返回完整的URL
reload（） 重新加载当前文档
reolace（） 用新的文档替换当前文档
3.screen对象
width 屏幕宽度
height屏幕高度
4.windows对象
prompt() 显示可提示用户输入的对话框
alert() 显示一个带有提示信息和一个“确定”按钮的警示对话框
confirm() 显示一个带有提示信息、“确定”和“取消”按钮的对话框
close() 关闭浏览器窗口
open() 打开一个新的浏览器窗口，加载给定URL所指定的文档
setTimeout() 在指定的毫秒数后调用函数或计算表达式
setInterval() 按照指定的周期（以毫秒计）来调用函数或表达式
5.document 对象
[close()] 关闭用 document.open() 方法打开的输出流，并显示选定的数据。
[getElementById()]返回对拥有指定 id 的第一个对象的引用。
[getElementsByName()] 返回带有指定名称的对象集合。
[getElementsByTagName()]返回带有指定标签名的对象集合。
[open()] 打开一个流document.writeln() 方法的输出。
[write()] 向文档写 HTML 表达式 或 JavaScript 代码。
[writeln()]等同于 write() 方法，不同的是在每个表达式之后写一个换行符。
注：获取cookie doucment.cookie
劫持cookie原理
服务器端可以设置cookie:httpOnly，来保证安全性
6.Navigator 对象
appCodeName 返回浏览器的代码名。
appMinorVersion 返回浏览器的次级版本。
appName 返回浏览器的名称。
appVersion 返回浏览器的平台和版本信息。
browserLanguage 返回当前浏览器的语言。
cookieEnabled 返回指明浏览器中是否启用 cookie 的布尔值。
cpuClass 返回浏览器系统的 CPU 等级。
onLine 返回指明系统是否处于脱机模式的布尔值。
platform 返回运行浏览器的操作系统平台。
systemLanguage 返回 OS 使用的默认语言。
userAgent 返回由客户机发送服务器的 user-agent 头部的值。
userLanguage 返回 OS 的自然语言设置。
二.操作DOM对象:
1、获得DOM节点
如
<body>
<div id="father">
<h2>我是标题</h2>
<p id="p1">p1</p>
<p class="p2">p2</p>
</div>
<script>
let h2 = document.getElementsByTagName('h2');
console.log(h2);
let p1 = document.getElementById('p1');
console.log(p1);
let p2 = document.getElementsByClassName('p2');
console.log(p2);
let father = document.getElementById('father');
console.log(father);
// 获取父节点下的所有子节点
let children = father.children;
console.log(children);
</script>
</body>
2、更新DOM节点:
如
<body>
<div id="id1">
</div>
<script>
// 先获取 DOM 节点
let div = document.getElementById('id1');
// 进行相应的修改
// 向 div 中添加元素
div.innerText='123';
// 可以解析 HTML 文本 div.innerHTML='<strong>456</strong>';
// 设置 css 样式
div.style.color='red';
div.style.fontSize='200px';
</script>
</body>
3、删除DOM节点:
<body>
<div id="father">
<h2>我是标题</h2>
<p id="p1">p1</p>
<p class="p2">p2</p>
</div>
<script>
// 先找到该 DOM 节点
let p1 = document.getElementById('p1');
// 进而找到 该 DOM 节点的 父 DOM 节点
let father = p1.parentElement;
// 通过 父 DOM 节点删除其 DOM 节点
father.removeChild(p1);
</script>
</body>
4、插入节点:
如（追加）
<body>
<p id="js">JavaScript</p>
<div id="list">
<p id="se">JavaSE</p>
<p id="ee">JavaEE</p>
<p id="me">JavaME</p>
</div>
<script>
let js = document.getElementById('js'); // 已存在节点
let list = document.getElementById('list');
list.appendChild(js);
</script>
</body>
如（创建一个新的标签,实现插入）
<body>
<p id="js">JavaScript</p>
<div id="list">
<p id="se">JavaSE</p>
<p id="ee">JavaEE</p>
<p id="me">JavaME</p>
</div>
<script>
// 创建一个新的节点进行插入
let newP = document.createElement('p');
// 给新的节点设置 id
newP.id = 'newP';
// 给新的节点中添加内容
let content = newP.innerHTML='Java';
// 根据设置的 id 进行追加
list.appendChild(newP);
</script>
</body>
