题目
- 融合识别浏览器的类型
- 分析拆解 url 各个部分
知识点
- navigator
- screen
- location
- history
W3C标准没有规定任何js基础相关的东西（变量、原型、作用域、异步）；定义了用于浏览器中js操作页面的API和全局变量
1、DOM
1.1、DOM本质
DOM可理解为：浏览器把拿到的html代码，结构化一个浏览器能识别并且js可操作的一个模型
######1.2、DOM节点操作
var div1 = document.getElementById('div1'); // 元素
var div2 = document.getElementsByTagName('div2'); //集合
var div3 = document.getElementsByClassName('div3'); //集合
var div4 = document.querySelectorAll('div4'); //集合
1.3、DOM结构操作
var div1 = document.getElementById('div1');
// 新增节点
var p1 = document.creatrElement('p');
p1.innerHTML = 'this is p1';
div1.appendChild(p1); // 增加新创建的元素
// 移动已有节点
var p2 = document.getElementById('p2');
div1.appendChild(p2);
// 获取父节点
var parent = div1.parentElement;
// 获取子节点
var childs = div1.childNodes;
// 删除节点
div1.removeChild(childs[0])
1.4、DOM属性（待完善）
Attribute和property区别？
Attribute 是对html标签属性的修改
property 是对js对象属性的修改
2、BOM
2.1、navigator
Navigator 对象
Navigator 对象包含有关浏览器的信息。
注释：没有应用于 navigator 对象的公开标准，不过所有浏览器都支持该对象。
Navigator 对象集合
| 集合 | 描述 |
|---|---|
| plugins[] | 返回对文档中所有嵌入式对象的引用。 |
| 该集合是一个 Plugin 对象的数组，其中的元素代表浏览器已经安装的插件。Plug-in 对象提供的是有关插件的信息，其中包括它所支持的 MIME 类型的列表。 | |
| 虽然 plugins[] 数组是由 IE 4 定义的，但是在 IE 4 中它却总是空的，因为 IE 4 不支持插件和 Plugin 对象。 |
Navigator 对象属性
| 属性 | 描述 |
|---|---|
| appCodeName | 返回浏览器的代码名。 |
| appCodeName | 返回浏览器的代码名。 |
| appMinorVersion | 返回浏览器的次级版本。 |
| appName | 返回浏览器的名称。 |
| appVersion | 返回浏览器的平台和版本信息。 |
| browserLanguage | 返回当前浏览器的语言。 |
| cookieEnabled | 返回指明浏览器中是否启用 cookie 的布尔值。 |
| cpuClass | 返回浏览器系统的 CPU 等级。 |
| onLine | 返回指明系统是否处于脱机模式的布尔值。 |
| platform | 返回运行浏览器的操作系统平台。 |
| systemLanguage | 返回 OS 使用的默认语言。 |
| userAgent | 返回由客户机发送服务器的 user-agent 头部的值。 |
| userLanguage | 返回 OS 的自然语言设置。 |
2.2、screen
Navigator 对象方法
| 方法 | 描述 |
|---|---|
| javaEnabled() | 规定浏览器是否启用 Java。 |
| taintEnabled() | 规定浏览器是否启用数据污点 (data tainting)。 |
Navigator 对象描述
Navigator 对象包含的属性描述了正在使用的浏览器。可以使用这些属性进行平台专用的配置。
虽然这个对象的名称显而易见的是 Netscape 的 Navigator 浏览器，但其他实现了 JavaScript 的浏览器也支持这个对象。
Navigator 对象的实例是唯一的，可以用 Window 对象的 navigator 属性来引用它。
2.3、location
Location 对象
Location 对象
Location 对象包含有关当前 URL 的信息。
Location 对象是 Window 对象的一个部分，可通过 window.location 属性来访问。
Location 对象属性
| 属性 | 描述 |
|---|---|
| hash | 设置或返回从井号 (#) 开始的 URL（锚）。 |
| host | 设置或返回主机名和当前 URL 的端口号。 |
| hostname | 设置或返回当前 URL 的主机名。 |
| href | 设置或返回完整的 URL。 |
| pathname | 设置或返回当前 URL 的路径部分。 |
| port | 设置或返回当前 URL 的端口号。 |
| protocol | 设置或返回当前 URL 的协议。 |
| search | 设置或返回从问号 (?) 开始的 URL（查询部分）。 |
Location 对象方法
| 属性 | 描述 |
|---|---|
| assign() | 加载新的文档。 |
| reload() | 重新加载当前文档。 |
| replace() | 用新的文档替换当前文档。 |
Location 对象存储在 Window 对象的 Location 属性中，表示那个窗口中当前显示的文档的 Web 地址。它的 href 属性存放的是文档的完整 URL，其他属性则分别描述了 URL 的各个部分。这些属性与 Anchor 对象（或 Area 对象）的 URL 属性非常相似。当一个 Location 对象被转换成字符串，href 属性的值被返回。这意味着你可以使用表达式 location 来替代 location.href。
不过 Anchor 对象表示的是文档中的超链接，Location 对象表示的却是浏览器当前显示的文档的 URL（或位置）。但是 Location 对象所能做的远远不止这些，它还能控制浏览器显示的文档的位置。如果把一个含有 URL 的字符串赋予 Location 对象或它的 href 属性，浏览器就会把新的 URL 所指的文档装载进来，并显示出来。
除了设置 location 或 location.href 用完整的 URL 替换当前的 URL 之外，还可以修改部分 URL，只需要给 Location 对象的其他属性赋值即可。这样做就会创建新的 URL，其中的一部分与原来的 URL 不同，浏览器会将它装载并显示出来。例如，假设设置了Location对象的 hash 属性，那么浏览器就会转移到当前文档中的一个指定的位置。同样，如果设置了 search 属性，那么浏览器就会重新装载附加了新的查询字符串的 URL。
除了 URL 属性外，Location 对象的 reload() 方法可以重新装载当前文档，replace() 可以装载一个新文档而无须为它创建一个新的历史记录，也就是说，在浏览器的历史列表中，新文档将替换当前文档。
2.4、history
History 对象
History 对象包含用户（在浏览器窗口中）访问过的 URL。
History 对象是 window 对象的一部分，可通过 window.history 属性对其进行访问。
注释：没有应用于 History 对象的公开标准，不过所有浏览器都支持该对象。
History 对象属性
| 属性 | 描述 |
|---|---|
| length | 返回浏览器历史列表中的 URL 数量。 |
History 对象方法
| 方法 | 描述 |
|---|---|
| back() | 加载 history 列表中的前一个 URL。 |
| forward() | 加载 history 列表中的下一个 URL。 |
| go() | 加载 history 列表中的某个具体页面。 |
History 对象描述
History 对象最初设计来表示窗口的浏览历史。但出于隐私方面的原因，History 对象不再允许脚本访问已经访问过的实际 URL。唯一保持使用的功能只有 back()、forward() 和 go() 方法。
例子
下面一行代码执行的操作与单击后退按钮执行的操作一样：
history.back()
下面一行代码执行的操作与单击两次后退按钮执行的操作一样：
history.go(-2)