2301_79516858的博客

接着，先把查询字符串按照&分割成数组， 2 每个元素的形式为 name=value。for 循环迭代这个数组，将每一个元素按照=分割成数组，这个数组 第一项是参数名，第二项是参数值。参数名和参数值在使用 decodeURIComponent()解码后(这是因为 查询字符串通常是被编码后的格式)分别保存在 name 和 value 变量中。给 URLSearchParams 构造函数传入一个查询字符串，就可以创建一个实例。现在，查询字符串中的每个参数都是返回对象的一个属性，这样使用起来就方便了。

在以前面提到的方式修改 URL 之后，浏览器历史记录中就会增加相应的记录。如果给 location.href 或 window.location 设置一个 URL，也会以同一个 URL 值调用 assign()方法。此时，“后退”按钮是禁用状态，即不能 返回这个示例页面，除非手动输入完整的 URL。除了 hash 之外，只要修改 location 的一个属性，就会导致页面重新加载新 URL。在这 3 种修改浏览器地址的方法中，设置 location.href 是最常见的。

最后一个修改地址的方法是 reload()，它能重新加载当前显示的页面。调用 reload()而不传参 数，页面会以最有效的方式重新加载。也就是说，如果页面自上次请求以来没有修改过，浏览器可能会 从缓存中加载页面。脚本中位于 reload()调用之后的代码可能执行也可能不执行，这取决于网络延迟和系统资源等因 素。为此，最好把 reload()作为最后一行代码。

检测浏览器是否安装了某个插件是开发中常见的需求。除 IE10 及更低版本外的浏览器，都可以通 过 plugins 数组来确定。这个数组中的每一项都包含如下属性。通常，name 属性包含识别插件所需的必要信息，尽管不是特别准确。检测插件就是遍历浏览器中。navigator 对象的属性通常用于确定浏览器的类型。 length:由当前插件处理的 MIME 类型数量。// 插件检测，IE10 及更低版本无效。 description:插件介绍。 filename:插件的文件名。 name:插件名称。

这个 hasPlugin()方法接收一个参数，即待检测插件的名称。IE 中的插件是实现为 COM 对象 的，由唯一的字符串标识。每个 MimeType 对象有 4 个属性:description 描述 MIME 类型，enabledPlugin 是 指向插件对象的指针，suffixes 是该 MIME 类型对应扩展名的逗号分隔的字符串，type 是完整的 MIME 类型字符串。而且，IE11 中的 ActiveXObject 也从 DOM 中隐身了，意味着 不能再用它来作为检测特性的手段。

在这个例子中，hasIEPlugin()函数接收一个 DOM 标识符参数。为检测插件，这个函数会使用传 入的标识符创建一个新 ActiveXObject 实例。相应代码封装在一个 try/catch 语句中，因此如果创 建的插件不存在则会抛出错误。如果创建成功则返回 true，如果失败则在 catch 块中返回 false。上 面的例子还演示了如何检测 Flash 和 QuickTime 插件。因为检测插件涉及两种方式，所以一般要针对特定插件写一个函数，而不是使用通常的检测函数。

当然，到底怎么才算联网取决于浏览器与系统实现。有些浏览器可能会认为只要连接到局域网就算 “在线”，而不管是否真正接入了互联网。navigator 对象还暴露了 NetworkInformation API，可以通过 navigator.connection 属性使用。这个 API 提供了一些只读属性，并为连接属性变化事件处理程序定义了一个事件对象。以下是 NetworkInformation API 暴露的属性。

浏览器检测硬件的能力相当有限。不过，navigator 对象还是通过一些属性提供了基本信息。

文档对象模型(DOM，Document Object Model)是 HTML 和 XML 文档的编程接口。DOM 表示 由多层节点构成的文档，通过它开发者可以添加、删除和修改页面的各个部分。脱胎于网景和微软早 期的动态 HTML(DHTML，Dynamic HTML)，DOM 现在是真正跨平台、语言无关的表示和操作网页 的方式。DOM Level 1 在 1998 年成为 W3C 推荐标准，提供了基本文档结构和查询的接口。

这两个属性前，最好先检测节点类型，如下所示: 7。

此外，childNodes 列表中的每个 节点都是同一列表中其他节点的同胞节点。调用这个方法后，要插入的节点会变成参照节点的 前一个同胞节点，并被返回。如果把文档中已经存在的节点传给 appendChild()，则这个节点会从之前的位置被转移到新位置。添加新节点会更新相关的关系指针，包括 父节点和之前的最后一个子节点。最后还有一个所有节点都共享的关系。父节点和它的第一个及最后一个子节点也有专门属性:firstChild 和 lastChild 分别指向 childNodes 中的第一个和最后一个子节点。

节点从技术上说仍然被同一个文档所拥有，但文档中已经没有它的位置。要移除节点而不是替换节点，可以使用 removeChild()方法。这个方法接收一个参数，即要移除的节点。与 replaceChild()方法一样，通过 removeChild()被移除的节点从技术上说仍然被同一个文档 所拥有，但文档中已经没有它的位置。上面介绍的 4 个方法都用于操纵某个节点的子元素，也就是说使用它们之前必须先取得父节点(使 用前面介绍的 parentNode 属性)。

浏览器控制台是个读取求值打印循环（REPL，read-eval-print-loop），与页面的JavaScript 运行。这个运行时就像浏览器对新出现在DOM 中的。

好的错误消息包含关于错误原因的确切信息，因此可以减少额外调试的工作量。这个简单的函数执行两个数的除法，但如果任何一个参数不是数值，则返回NaN。相比于之前的例子，使用assert()函数可以减少抛出自定义错误所需的代码量，并且让代码更好。报告这个错误消息时，你立即就能根据它包含的信息定位到问题，包括问题的解决方案。这样，其他代码调用的将是这个函数，而不是通用的日志方法。的方法，这样无论在哪里用到的日志打印方法，都会按照自定义的方式行事。具体的浏览器错误消息，这个错误消息显示更有价值。

所谓无效字符，指的是JavaScript 语法中没有定义过的字符。IE 的event 对象是作为window 的一个属性存在的，会在事件。接下来几节分别讨论旧版IE 中可能会出现的常见且难于调试的JavaScript 错误。如前所述，旧版IE 中所有DOM对象都是用COM 对象实现的，并非原生JavaScript 对象。事件处理程序退出后，event 对象会被销毁，因此闭包中对它的引用也就不存在了，于是就会报告未找。在将块级元素插入不恰当的位置时，其他浏览器会尝试纠正，这样就不会发生错误，但IE 在这种。

如果网页中引用的一个外部JavaScript 文件由于某种原因返回了非JavaScript 代码，则IE 会抛出语。通常，当IE 报告语法错误时，原因是很清楚的。一般来说，可以通过错误消息追踪到少了一个分。不过，有一种情况下报告的语法错误并不清楚。

xmldom 变量包含DOM Level 2 Document 类型的实例，包括第12 章介绍的所有DOM 方法和属性。自从有了DOM 标准，所。在JavaScript 中处理XML 时，root 参数通常只会使用一次，因为这个参数定义的是XML DOM。DOM 标准不仅是为了在浏览器中使用，而且还为了在桌面和服务器应用程序中处理XML 数据结构。实践中，很少需要凭空创建XML 文档，然后使用DOM 方法来系统创建XML 数据结构。这个例子创建了一个XML DOM文档，该文档没有默认的命名空间和文档类型。

Firefox 和Opera 此时会返回document 元素为的文档，而在Chrome 和Safari 返回的文。要使用DOMParser，需要先创建它的一个实例，然后再调用parseFromString()方法。档传给serializeToString()时，这个文档会被当成XML 文档，因此得到的结果是格式良好的。DOMParser 只能解析格式良好的XML，因此不能把HTML 解析为HTML文档。档中，是的第一个子元素。这个例子中解析的XML 字符串少一个标签，因此会导致解析错误。

 XPathResult.UNORDERED_NODE_ITERATOR_TYPE：返回匹配节点的集合，但集合中节点的顺。 XPathResult.ORDERED_NODE_SNAPSHOT_TYPE：返回节点集合的快照，在文档外部捕获节点， XPathResult.ORDERED_NODE_ITERATOR_TYPE：返回匹配节点的集合，集合中节点的顺序与。 XPathResult.ANY_UNORDERED_NODE_TYPE：返回匹配节点的集合，但集合中节点的顺序可能。要确定浏览器是否支持。

XPathResult.FIRST_ORDERED_NODE_TYPE 结果类型返回匹配的第一个节点，可以通过结果的。在这个例子中，如果有任何节点匹配"employee/name"，booleanValue 属性就等于true。对于数值类型，XPath 表达式必须使用返回数值的XPath 函数，如count()可以计算匹配给定模式。对于字符串类型，evaluate()方法查找匹配XPath 表达式的第一个节点，然后返回其第一个子节。要确定返回的结果类型，可以访问求值结果的resultType 属性，如。

在这个XML 文档中，所有元素的命名空间都属于http://www.wrox.com/，都以wrox 前缀标识。对于使用命名空间的XML 文档，必须告诉XPathEvaluator 命名空间信息，才能进行正确求值。个方法只接收一个参数，即包含命名空间定义的文档节点。与之相关的正式API，正式的DOM 中也没有涵盖它。在并不知晓文档的哪个节点包含命名空间定义时，可以采用这种定义命名空间解析函数的方式。果想使用XPath 查询该文档，就需要指定使用的命名空间，否则求值会失败。浏览器对XSLT 的支持。

所谓无效字符，指的是JavaScript 语法中没有定义过的字符。IE 的event 对象是作为window 的一个属性存在的，会在事件。接下来几节分别讨论旧版IE 中可能会出现的常见且难于调试的JavaScript 错误。如前所述，旧版IE 中所有DOM对象都是用COM 对象实现的，并非原生JavaScript 对象。事件处理程序退出后，event 对象会被销毁，因此闭包中对它的引用也就不存在了，于是就会报告未找。在将块级元素插入不恰当的位置时，其他浏览器会尝试纠正，这样就不会发生错误，但IE 在这种。

如果网页中引用的一个外部JavaScript 文件由于某种原因返回了非JavaScript 代码，则IE 会抛出语。通常，当IE 报告语法错误时，原因是很清楚的。一般来说，可以通过错误消息追踪到少了一个分。不过，有一种情况下报告的语法错误并不清楚。

xmldom 变量包含DOM Level 2 Document 类型的实例，包括第12 章介绍的所有DOM 方法和属性。自从有了DOM 标准，所。在JavaScript 中处理XML 时，root 参数通常只会使用一次，因为这个参数定义的是XML DOM。DOM 标准不仅是为了在浏览器中使用，而且还为了在桌面和服务器应用程序中处理XML 数据结构。实践中，很少需要凭空创建XML 文档，然后使用DOM 方法来系统创建XML 数据结构。这个例子创建了一个XML DOM文档，该文档没有默认的命名空间和文档类型。

xmldom 变量包含DOM Level 2 Document 类型的实例，包括第12 章介绍的所有DOM 方法和属性。自从有了DOM 标准，所。在JavaScript 中处理XML 时，root 参数通常只会使用一次，因为这个参数定义的是XML DOM。DOM 标准不仅是为了在浏览器中使用，而且还为了在桌面和服务器应用程序中处理XML 数据结构。实践中，很少需要凭空创建XML 文档，然后使用DOM 方法来系统创建XML 数据结构。这个例子创建了一个XML DOM文档，该文档没有默认的命名空间和文档类型。

 XPathResult.UNORDERED_NODE_ITERATOR_TYPE：返回匹配节点的集合，但集合中节点的顺。 XPathResult.ORDERED_NODE_SNAPSHOT_TYPE：返回节点集合的快照，在文档外部捕获节点， XPathResult.ORDERED_NODE_ITERATOR_TYPE：返回匹配节点的集合，集合中节点的顺序与。 XPathResult.ANY_UNORDERED_NODE_TYPE：返回匹配节点的集合，但集合中节点的顺序可能。要确定浏览器是否支持。

XPathResult.FIRST_ORDERED_NODE_TYPE 结果类型返回匹配的第一个节点，可以通过结果的。在这个例子中，如果有任何节点匹配"employee/name"，booleanValue 属性就等于true。对于数值类型，XPath 表达式必须使用返回数值的XPath 函数，如count()可以计算匹配给定模式。对于字符串类型，evaluate()方法查找匹配XPath 表达式的第一个节点，然后返回其第一个子节。要确定返回的结果类型，可以访问求值结果的resultType 属性，如。

在这个XML 文档中，所有元素的命名空间都属于http://www.wrox.com/，都以wrox 前缀标识。对于使用命名空间的XML 文档，必须告诉XPathEvaluator 命名空间信息，才能进行正确求值。个方法只接收一个参数，即包含命名空间定义的文档节点。与之相关的正式API，正式的DOM 中也没有涵盖它。在并不知晓文档的哪个节点包含命名空间定义时，可以采用这种定义命名空间解析函数的方式。果想使用XPath 查询该文档，就需要指定使用的命名空间，否则求值会失败。浏览器对XSLT 的支持。

setParameter()方法必须在调用transformToDocument()或transformToFragment()之前调用。如果想得到文档片段，则可以调用transformToFragment()。格式为"text"时调用transformToDocument()会返回完整的XML 文档，但这个文档的内容会因浏。与参数相关的还有两个方法：getParameter()和removeParameter()。如果XSLT 样式表的输出格式是"xml"或"html"，则创建文档或文档片段理所当然。

制定了JavaScript 对象简谱（JSON，JavaScript Object Notation）标准，即RFC 4627。JSON 是JavaScript 的严格子集，利用JavaScript 中的几种模式来表示结构。JavaScript 字符串与JSON 字符串的主要区别是，JSON 字符串必须使用双引号（单引号会导致语法。与JavaScript 不同，JSON 中的对象属性名必须始终带双引号。虽然这对JavaScript 开发者来说是标准的对象字面量，但JSON 中的对象必须使用双引号把属性名。

JSONP 是“JSON with padding”的简写，是在Web 服务上流行的一种JSON 变体。这个例子创建了一个新的Image 实例，然后为它的onload 和onerror 事件处理程序添加了同一。这个JSONP 请求的URL 是一个地理位置服务。、CORS 出现之前，实现跨源Ajax 通信是有点麻烦的。数据通过查询字符串发送，响应可以随意设置，不过一般是位图图片或值为204 的状态码。函数的名称是通过请求来动态指定的。当然，图片探测的缺点是只能发。标签实现跨域通信的最早的一种技术。

Fetch API 是WHATWG 的一个“活标准”（living standard），用规范原文说，就是“Fetch 标准定义请求、Fetch API 能够执行XMLHttpRequest 对象的所有任务，但更容易使用，接口也更现代化，能够在。Fetch API 本身是使用JavaScript 请求资源的优秀工具，同时这个API 也能够应用在服务线程。fetch()方法是暴露在全局作用域中的，包括主页面执行线程、模块和工作线程。响应，以及绑定二者的流程：获取（fetch）”。

与XMLHttpRequest 一样，fetch()既可以发送数据也可以接收数据。使用init 对象参数，可。以配置fetch()在请求体中发送各种序列化的数据。

Headers 与Map 类型都有get()、set()、has()和delete()Headers 实例，可以通过Request.prototype.headers 访问，每个入站Response 实例也可以通过。Response.prototype.headers 访问包含着响应头部的Headers 对象。这是合理的，因为HTTP 头部本质上是序列化后的键/值对，Headers 对象是所有外发请求和入站响应头部的容器。另外，使用new Headers()也可以创建一个新实例。// 确定值已经删除。

response 在通过构造函数初始化Response 对象时激活不允许修改禁止修改的响应头部（参见MDN 文。Headers 实例中还不存在的头部上调用append()方法相当于调用set()。在初始化Headers 对象时，也可以使用键/值对形式的对象，Headers 实例会因来源不同而展现不同的行为，它们的行为由护卫来控制。不同的护卫设置会改变set()、append()和delete()的行为。一个HTTP 头部字段可以有多个值，而Headers 对象通过append()方法支持添加多个值。

Fetch API 提供了两种不太一样的方式用于创建Request 对象的副本：使用Request 构造函数和使。关键在于，通过fetch 使用Request 会将请求体标记为已使用。要想基于包含请求体的相同Request 对象多次调用fetch()，必须在第一次发送fetch()请求前。第二种克隆Request 对象的方式是使用clone()方法，这个方法会创建一模一样的副本，任何值。如果请求对象的bodyUsed 属性为true（即请求体已被读取），那么上述任何一种方式都不能用来。创建这个对象的副本。

Response 类还有两个用于生成Response 对象的静态方法：Response.redirect()和Response.Response 对象的期约，这个Response 对象代表实际的HTTP 响应。另一个静态方法Response.error()用于产生表示网络错误的Response 对象（网络错误会导致。还可以接收一个可选的init 对象，这个对象可以包含下表所列的键和值。大多数情况下，产生Response 对象的主要方式是调用fetch()，它返回一个最后会解决为。用响应体的不同方式。

克隆Response 对象的主要方式是使用clone()方法，这个方法会创建一个一模一样的副本，不。如果响应对象的bodyUsed 属性为true（即响应体已被读取），则不能再创建这个对象的副本。此外，通过创建带有原始响应体的Response 实例，可以执行伪克隆操作。对于重定向响应，这是最终的URL，非重定向响应就是它产生的。Response 对象包含一组只读属性，描述了请求完成后的状态，如下表所示。 error：表示响应对象是通过Response.error()创建的。可能是下列字符串值之一。

Request 和Response 都使用了Fetch API 的Body 混入，以实现两者承担有效载荷的能力。可能会导致网络延迟，另一个原因是流API 本身在处理有效载荷方面是有优势的。Body 混入提供了5 个方法，用于将ReadableStream 转存到缓冲区的内存里，将缓冲区转换为某。示body 流是否已读）和一组方法，用于从流中读取内容并将结果转换为某种JavaScript 对象类型。通常，将Request 和Response 主体作为流来使用主要有两个原因。一个原因是有效载荷的大小。

JSONP 是“JSON with padding”的简写，是在Web 服务上流行的一种JSON 变体。这个例子创建了一个新的Image 实例，然后为它的onload 和onerror 事件处理程序添加了同一。这个JSONP 请求的URL 是一个地理位置服务。CORS 出现之前，实现跨源Ajax 通信是有点麻烦的。数据通过查询字符串发送，响应可以随意设置，不过一般是位图图片或值为204 的状态码。函数的名称是通过请求来动态指定的。当然，图片探测的缺点是只能发。标签实现跨域通信的最早的一种技术。