客户端JS——“Web浏览器中的JS”

cooxer 发布于2019-08-19 18:05 / 1133人阅读

摘要：在这个阶段属性值是当解析器遇到没有和属性的元素时，它把这些元素添加到文档中，然后执行行内或外部脚本。这些脚本会同步执行，并且在脚本下载如果需要和执行时解析器会暂停。解析器恢复时这些文本会成为文档的一部分。浏览器在对象上触发事件。

1 客户端JavaScript

window对象自身也有一个名为window的属性，指向window对象

window.window.window.location.pathname;

2 在HTML里嵌入JavaScript 2.1 script元素

在XHTML中使用JavaScript，则需要放到一个CDATA部分：

2.2 脚本类型

把type属性设置为浏览器不能识别的值，即可在html页面中嵌入任意文本内容。

2.3 URL中的JavaScript（避免使用）

javascript:协议限定符

可以用void操作符强制函数调用或给表达式赋予undefined值

它被当做一个多带带的一行代码对待，语句之间必须用分号隔开。

w time ist?

书签

书签就是一个保存起来的URL。如果书签是javascript:URL，那么保存的就是一小段脚本，叫做bookmarklet。只要书签不返回值，它就可以操作当前显示的任何文档。

3 JavaScript程序的执行 3.1 同步、异步和延迟的脚本

script标签可以有defer和async属性，可以改变脚本的执行方式。这些属性只在和src属性联合使用时才有效：

async 属性规定一旦脚本可用，则会异步执行。async 属性仅适用于外部脚本（只有在使用 src 属性时）。

defer 属性规定是否对脚本执行进行延迟，直到页面加载为止。

3.2 客户端JavaScript时间线

Web浏览器创建Document对象，并开始解析Web页面，解析html元素和它们的文本内容后添加Element对象和Text节点到文档中。在这个阶段documen.readystate属性值是“loading”

当HTML解析器遇到没有async和defer属性的script元素时，它把这些元素添加到文档中，然后执行行内或外部脚本。这些脚本会同步执行，并且在脚本下载（如果需要）和执行时解析器会暂停。这样脚本就可以用documen.wrte()来把文本插入到输入流中。解析器恢复时这些文本会成为文档的一部分。同步脚本经常简单定义函数和注册后面使用的注册时间处理程序，但他们可以遍历和操作文档树，因为在他们执行时已经存在了。这样，同步脚本可以看到它自己的script元素和它们之前的文档内容。

当解析器遇到设置了async属性的script元素时，它开始下载脚本文本，并继续解析文档。脚本会在它下载完成后尽快执行，但是解析器没有停下来等它下载。异步脚本禁止使用document.write()方法。它们可以看到自己的script元素和它之前的所有文档元素，并且可能或干脆不可能访问其他的文档内容。

当文档完成解析，document.readyState属性变成“interactive”。

所有有defer属性的脚本，会桉它们在文档里的出现顺序执行。异步脚本可能也会在这个时间执行。延迟脚本能访问完整的文档树，禁止使用document.write()方法。

浏览器在Document对象上触发DOMContentLoaded事件。这标志着程序执行从同步脚本执行阶段转换到事件驱动阶段。但要注意，这时可能还有异步脚本没有执行完成

这时，文档已经完全解析完成，但是浏览器可能还在等待其他内容载入，如图片。当所有这些内容完成载入时，并且所有异步脚本完成载入和执行，document.readyState属性改变为“complete”，Web浏览器触发Window对象上的load时间。

从此刻起，会调用异步事件，以异步响应用户输入事件、网络事件、计时器过期等。

4 兼容性和互用性 4.1 功能测试

常见的功能测试：

if (element.addEventListener) {
    element.addEventListener("keydown", handler, false);
    element.addEventListener("keypress", handler, false);
} else if (element.attachEvent) {
    element.attachEvent("onkeydown", handler);
    element.attachEvent("onkeypress", handler);
} else {
    element.onkeydown = element.onkeypress = handler;
}

4.2 怪异模式和标准测试

document.compatMode属性，如果为"CSS1Compat"，则是在标准模式，如果在"BackCompat或undefined"，则是在怪异模式。

4.3 浏览器测试

早前通常需要做浏览器测试，即使用Navigator对象。

4.4 IE里的条件注释

IE中的条件注释（Conditionalcomments）对IE的版本和IE非IE有优秀的区分能力，是WEB设计中常用的hack方法。

条件注释只能用于IE5以上。

gt :greater than，选择条件版本以上版本，不包含条件版本

lt : lessthan，选择条件版本以下版本，不包含条件版本

gte :greater than or equal，选择条件版本以上版本，包含条件版本

lte :less than or equal，选择条件版本以下版本，包含条件版本

! : 选择条件版本以外所有版本，无论高低

使用方法：

您使用不是Internet Explorer

您正在使用InternetExplorer version 6或者一个非IE 浏览器

IE的JavaScript解释器也支持条件注释：

/*@cc_on
@if(@_jscript)
alert("You are using Internet Explorer");
@else*/
alert("you are not using Internet Explorer");
/*@end
@*/

云服务器 GPU云服务器 js 客户端存储 js攻击客户端 js判断客户端 js mac 客户端

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/79177.html

详解Vue服务端渲染

摘要：二服务端渲染初体验使用的服务端渲染功能，需要引入提供的服务端渲染模块，其作用是创建一个渲染器，该渲染器可以将实例渲染成字符串。详解Vue服务端渲染一、服务端渲染 - 简介所谓服务端渲染就是将代码的渲染交给服务器，服务器将渲染好的html字符串返回给客户端，再由客户端进行显示。服务器端渲染的优点有利于SEO搜索引擎优化，因为服务端渲染是将渲染好的html字符串返回给了客户端，...

Paul_King 2019-08-26 10:33 评论0 收藏0
5个提高Node.js应用性能的技巧

摘要：如果你有一个高流量的站点，提高性能的第一步是在你的前面放一个反向代理服务器。使用在一个已经存在的服务器前做反向代理，作为的一个核心应用，已经被用于全世界成千上万的站点中。如果你的 node 服务器前面没有 nginx, 那么你可能做错了。— Bryan Hughes Node.js 是使用最流行的语言— JavaScript 构建服务器端应用的领先工具。由于可以同时提供 web ...

k00baa 2019-07-25 13:40 评论0 收藏0
后端知识点总结——NODE.JS基础

摘要：后端知识点总结基础不是是一种软件开发平台，它的竞争对象历史第一次有一种语言可以通吃前后端网站阿里云镜像版本年初年中年底最新版本功能强大可靠，适合大型企业级项目简单易用适合互联网项目易用适合平台性能好适合服务器端密集型项目不适合密集型项目密集后端知识点总结——NODE.JS基础 1.Node.js Node.js不是JS,是一种软件开发平台，它的竞争对象JSP/PHP/ASP.NET...

Freeman 2019-08-22 16:13 评论0 收藏0