diff --git a/files/zh-cn/games/introduction_to_html5_game_development/index.html b/files/zh-cn/games/introduction_to_html5_game_development/index.html index 5758856b642864..223f57ce7228fa 100644 --- a/files/zh-cn/games/introduction_to_html5_game_development/index.html +++ b/files/zh-cn/games/introduction_to_html5_game_development/index.html @@ -10,7 +10,7 @@
{{GamesSidebar}}
-

优点

+

优点

  1. 使用 HTML5 构建的游戏可以在智能手机,平板电脑,个人电脑和智能电视上工作。
  2. @@ -22,7 +22,7 @@

    优点

  3. 玩家可随时随地玩游戏。
-

网络技术

+

网络技术

 
diff --git a/files/zh-cn/glossary/base64/index.html b/files/zh-cn/glossary/base64/index.html index 4a4809f0e9360e..f6ece60066717b 100644 --- a/files/zh-cn/glossary/base64/index.html +++ b/files/zh-cn/glossary/base64/index.html @@ -31,7 +31,7 @@

编码尺寸增加

-

文档

+

文档

data URIs
@@ -58,7 +58,7 @@

文档

-

工具

+

工具

- +
- +
-

文章原始信息

+

文章原始信息

-

JavaScript 运行次序

+

JavaScript 运行次序

当浏览器执行到一段 JavaScript 代码时,通常会按从上往下的顺序执行这段代码。这意味着你需要注意代码书写的顺序。比如,我们回到第一个例子中的 JavaScript 代码:

@@ -227,7 +227,7 @@

JavaScript 运行次序

:这是一个很常见的错误,在引用对象之前必须确保该对象已经存在。

-

解释代码 vs 编译代码

+

解释代码 vs 编译代码

作为程序员,你或许听说过这两个术语:解释(interpret)编译 (compile)。在解释型语言中,代码自上而下运行,且实时返回运行结果。代码在由浏览器执行前,不需要将其转化为其他形式。代码将直接以文本格式(text form)被接收和处理。

@@ -237,23 +237,23 @@

解释代码 vs 编译代码

两种类型的语言各有优势,这个问题我们暂且不谈。

-

服务器端代码 vs 客户端代码

+

服务器端代码 vs 客户端代码

你或许还听说过服务器端(server-side)客户端(client-side)代码这两个术语,尤其是在 web 开发时。客户端代码是在用户的电脑上运行的代码,在浏览一个网页时,它的客户端代码就会被下载,然后由浏览器来运行并展示。这就是客户端 JavaScript

而服务器端代码在服务器上运行,接着运行结果才由浏览器下载并展示出来。流行的服务器端 web 语言包括:PHP、Python、Ruby、ASP.NET 以及...... JavaScript!JavaScript 也可用作服务器端语言,比如现在流行的 Node.js 环境,你可以在我们的 动态网页 - 服务器端编程 主题中找到更多关于服务器端 JavaScript 的知识。

-

动态代码 vs 静态代码

+

动态代码 vs 静态代码

动态”一词既适用于客户端 JavaScript,又适用于描述服务器端语言。是指通过按需生成新内容来更新 web 页面 / 应用,使得不同环境下显示不同内容。服务器端代码会在服务器上动态生成新内容,例如从数据库中提取信息。而客户端 JavaScript 则在用户端浏览器中动态生成新内容,比如说创建一个新的 HTML 表格,用从服务器请求到的数据填充,然后在网页中向用户展示这个表格。两种情况的意义略有不同,但又有所关联,且两者(服务器端和客户端)经常协同作战。

没有动态更新内容的网页叫做“静态”页面所显示的内容不会改变。

-

怎样向页面添加 JavaScript?

+

怎样向页面添加 JavaScript?

可以像添加 CSS 那样将 JavaScript 添加到 HTML 页面中。CSS 使用 {{htmlelement("link")}} 元素链接外部样式表,使用 {{htmlelement("style")}} 元素向 HTML 嵌入内部样式表,JavaScript 这里只需一个元素——{{htmlelement("script")}}。我们来看看它是怎么工作的。

-

内部 JavaScript

+

内部 JavaScript

  1. 首先,下载示例文件 apply-javascript.html。放在一个好记的文件夹里。
  2. @@ -291,7 +291,7 @@

    内部 JavaScript

    : 你可以在 GitHub 上查看此版本 apply-internal.html (也可在线查看)。

    -

    外部 JavaScript

    +

    外部 JavaScript

    这很不错,但是能不能把 JavaScript 代码放置在一个外部文件中呢?现在我们来研究一下。

    @@ -320,7 +320,7 @@

    外部 JavaScript

    :你可以在 GitHub 上查看这个版本 apply-external.html 以及 script.js (也可在线查看).

    -

    内联 JavaScript 处理器

    +

    内联 JavaScript 处理器

    注意,有时候你会遇到在 HTML 中存在着一丝真实的 JavaScript 代码。它或许看上去像这样:

    @@ -378,7 +378,7 @@
    Inline JavaScript

    :请尝试修改 apply-javascript.html 以添加更多按钮。刷新后可发现按下任一按钮时都会创建一个段落。很高效吧。

    -

    脚本调用策略

    +

    脚本调用策略

    要让脚本调用的时机符合预期,需要解决一系列的问题。这里看似简单,实际大有文章。最常见的问题就是:HTML 元素是按其在页面中出现的次序调用的,如果用 JavaScript 来管理页面上的元素(更精确的说法是使用 文档对象模型 DOM),若 JavaScript 加载于欲操作的 HTML 元素之前,则代码将出错。

    @@ -404,7 +404,7 @@

    脚本调用策略

    解决此问题的旧方法是:把脚本元素放在文档体的底端(</body> 标签之前,与之相邻),这样脚本就可以在 HTML 解析完毕后加载了。此方案(以及上述的 DOMContentLoaded 方案)的问题是:只有在所有 HTML DOM 加载完成后才开始脚本的加载/解析过程。对于有大量 JavaScript 代码的大型网站,可能会带来显著的性能损耗。这也是 async 属性诞生的初衷。

    -

    asyncdefer

    +

    asyncdefer

    上述的脚本阻塞问题实际有两种解决方案 —— asyncdefer。我们来依次讲解。

    @@ -437,7 +437,7 @@

    asyncdefer

    如果脚本需要等待页面解析,且依赖于其它脚本,调用这些脚本时应使用 defer,将关联的脚本按所需顺序置于 HTML 中。 -

    注释

    +

    注释

    就像 HTML 和 CSS,JavaScript 代码中也可以添加注释,浏览器会忽略它们,注释只是为你的同事(还有你,如果半年后再看自己写的代码你会说,这是什么垃圾玩意。)提供关于代码如何工作的指引。注释非常有用,而且应该经常使用,尤其在大型应用中。注释分为两类:

    @@ -474,7 +474,7 @@

    注释

    buttons[i].addEventListener('click', createParagraph); } -

    小结

    +

    小结

    恭喜你,迈出了探索 JavaScript 世界的第一步。我们从理论开始,介绍为什么要使用 JavaScript,以及用它能做什么事情。过程中穿插了一些代码示例并讲解了 JavaScript 如何与网站中其他代码适配,等等。

    @@ -482,7 +482,7 @@

    小结

    {{NextMenu("Learn/JavaScript/First_steps/A_first_splash", "Learn/JavaScript/First_steps")}}

    -

    本章目录

    +

    本章目录

    -

    使用 MDN

    +

    使用 MDN

    您现在所在的网站上有大量信息可供您使用,既有查找代码语法的参考资料,也有学习技巧的指南/教程。

    @@ -287,7 +287,7 @@

    使用 MDN

    如果你不确定该读哪篇文章,那么尝试在 MDN 中搜索一些相关的关键字(如上所述),或者尝试一般的网络搜索。要在 MDN 上搜索,你可以使用网站内置的搜索功能,或者使用你最喜欢的搜索引擎,在搜索词前面加上“MDN”。例如,“mdn responsive web design“或者”mdn background-color“。

    -

    其他在线资源

    +

    其他在线资源

    我们在之前已经提到了 Stack Overflow,但在这里还有其他在线资源可以提供帮助。

    @@ -301,13 +301,13 @@

    其他在线资源

    然而,在 Twitter 或 Facebook 等社交网站上寻找有用的群组也是有意义的。寻找讨论你感兴趣的网络开发主题的小组,并加入其中。在 twitter 上关注那些你知道有影响力、聪明或平易近人的人,他们似乎分享了很多有用的建议。

    -

    线下聚会

    +

    线下聚会

    最后,你应该尝试参加一些线下聚会,认识其他志同道合的人,尤其是那些对初学者友好的人。 meetup.com 是一个很好的地方,可以找到当地的身体聚会,你也可以尝试搜索你当地的媒体/网站上的内容。

    你也可以尝试参加正式的网络会议。虽然这些费用可能很高,但你可以尝试在那里做志愿者,许多会议都提供优惠票,例如学生票或多样性票。

    -

    参见

    +

    参见

    -

    Technical Background

    +

    Technical Background

    完整的 MIME 类型列表可在 IANA | MIME Media Types 查看。

    HTTP specification 中定义了能够描述在 web 中使用的媒体类型的 MIME 超集。

    -

    Why are correct MIME types important?

    +

    Why are correct MIME types important?

    Example of an incorrect MIME type result 假如 web 服务器或者应用报告内容的 MIME 类型不正确,根据 HTTP 规范,或许发起人想要处理和显示内容通过他所规定的 MIME 类型,因此 web 浏览器无法采取任何措施。

    @@ -46,17 +46,17 @@

    为何浏览器不应该猜测 MIME 类型

    +

    为何浏览器不应该猜测 MIME 类型

    除了违返了 HTTP 规范,让浏览器去猜测正确的 MIME 类型是一个差劲的策略。原因如下

    -

    失去控制

    +

    失去控制

    假如浏览器忽略报告的 MIME 类型,web 管理员和用户不在对内容如何进行处理有发言权了。

    例如,面对 web 开发员的网址可能希望发送某些实例 HTML 文档,同时通希望能够以 text/html或者 text/plain 的 MIME 类型进行数据的处理和显示 或者 作为一个源代码。如果浏览器猜测它的正确 MIME 类型为 text/html 那么开发员不在有权利进行选择了。

    -

    安全性

    +

    安全性

    一些内容类型,例如可执行程序,本质上是不安全的。原因是经过规范化的 MIME 类型都有经过严格规定浏览器如何对这类类型的文件进行操作。一个可执行程序不能够在用户的电脑浏览器上执行,但可以通过弹出会话询问是否下载这个文件

    @@ -98,7 +98,7 @@

    如何设置服务器 -

    +
    -

    Original Document Information

    +

    Original Document Information

    -

    安装 moment

    +

    安装 moment

    在项目的根目录,输入下列命令

    npm install moment
    -

    创建虚拟属性

    +

    创建虚拟属性

    1. 打开 ./models/bookinstance.js.
    2. @@ -38,7 +38,7 @@

      创建虚拟属性

      注意: 格式化方法可以使用几乎任何模式显示日期。moment 文档中,可以找到表示不同日期组件的语法。

      -

      更新视图

      +

      更新视图

      打开 /views/bookinstance_list.pug ,然后用  due_back_formatted 取代 due_back

      diff --git a/files/zh-cn/learn/server-side/express_nodejs/displaying_data/flow_control_using_async/index.html b/files/zh-cn/learn/server-side/express_nodejs/displaying_data/flow_control_using_async/index.html index c2bf95515a1bbe..18606793a3f47d 100644 --- a/files/zh-cn/learn/server-side/express_nodejs/displaying_data/flow_control_using_async/index.html +++ b/files/zh-cn/learn/server-side/express_nodejs/displaying_data/flow_control_using_async/index.html @@ -17,7 +17,7 @@
    3. async.waterfall() 用于必须序列运行的操作,每个操作取决于前面操作的结果。
    4. -

      为什么需要这么做?

      +

      为什么需要这么做?

      我们在 Express 中使用的大多数方法,都是异步的 - 您指定要执行的操作,传递回调。该方法立即返回,并在请求的操作完成时,调用回调。按照 Express 中的惯例,回调函数将错误值作为第一个参数传递(或成功时为 null),并将函数的结果(如果有的话)作为第二个参数传递。

      @@ -38,7 +38,7 @@

      为什么需要这

      一个更好的解决方案,是并行执行所有请求,然后在所有查询完成后执行单个回调。这是 Async 模块简化的流操作!

      -

      平行的非同步操作

      +

      平行的非同步操作

      方法async.parallel()用于并行运行多个异步操作。

      @@ -62,7 +62,7 @@

      平行的非同步

      如果您将一组函数,作为第一个参数传递,则结果将是一个数组(数组顺序结果,将与声明函数的原始顺序匹配 - 而不是它们完成的顺序)。

      -

      序列的非同步操作

      +

      序列的非同步操作

      async.series()方法用于按顺序运行多个异步操作,后续函数不依赖于先前函数的输出。它本质上是声明的,并且行为与async.parallel().相同。

      @@ -98,7 +98,7 @@

      序列的非同步 } ); -

      依赖序列的非同步操作

      +

      依赖序列的非同步操作

      方法async.waterfall()用于在每个操作依赖于前一个操作的结果时,依次运行多个异步操作。

      @@ -123,7 +123,7 @@

      依赖序列 } ); -

      安装 async

      +

      安装 async

      使用 NPM 包管理器安装 async 模块,以便我们可以在代码中使用它。您可以常规方式执行此操作,在 LocalLibrary 项目的根目录中,打开命令提示并输入以下命令:

      diff --git a/files/zh-cn/learn/server-side/express_nodejs/displaying_data/home_page/index.html b/files/zh-cn/learn/server-side/express_nodejs/displaying_data/home_page/index.html index 6f582e5b65fcc6..0bed7b1e5c4109 100644 --- a/files/zh-cn/learn/server-side/express_nodejs/displaying_data/home_page/index.html +++ b/files/zh-cn/learn/server-side/express_nodejs/displaying_data/home_page/index.html @@ -7,7 +7,7 @@

      我们已经为主页创建了一个路由。为了完成页面,我们需要更新控制器函数,以从数据库中提取记录的“计数”,并创建一个可用于呈现页面的视图(模板)。

      -

      路由

      +

      路由

      前面的教程,我们创建 index 页面路由。此处要提醒的是,所有的路由函式,都定义在 /routes/catalog.js:

      @@ -23,7 +23,7 @@

      路由

      我们扩展这个控制器函数,以从我们的模型获取信息,然后使用模板(视图)渲染它。

      -

      控制器

      +

      控制器

      索引控制器函数需要获取以下有关信息,即数据库中有多少BookBookInstance,可用的BookInstanceAuthorGenre记录,将这些数据渲染到模板中,以创建 HTML 页面,然后将其返回到 HTTP 响应中。

      @@ -84,7 +84,7 @@

      控制器

      注意: 上面的async.parallel()裡的回调函数有点不寻常,因为不管是否出现错误,我们都会渲染页面(通常您可能使用单独的执行路径来处理错误的显示)。

      -

      视图

      +

      视图

      打开 /views/index.pug ,并用底下文字取代它的内容。

      @@ -116,7 +116,7 @@

      视图

      注意: 我们没有转义计数值 (i.e. 我们使用 !{} 语法) ,因为计数值已经被计算过了。如果信息是由终端用户提供的,那么我们就会转义該变量,以用于显示。

      -

      它看起来像是?

      +

      它看起来像是?

      此处,我们应该已经创建了呈现 index 页面,所需要的每样东西。运行本地图书馆应用,并打开浏览器访问 http://localhost:3000/。如果每样东西都设定正确了,你的网站看起来应该像底下的截图。

      diff --git a/files/zh-cn/learn/server-side/express_nodejs/displaying_data/template_primer/index.html b/files/zh-cn/learn/server-side/express_nodejs/displaying_data/template_primer/index.html index 6d2da265b0c500..69d411795cca23 100644 --- a/files/zh-cn/learn/server-side/express_nodejs/displaying_data/template_primer/index.html +++ b/files/zh-cn/learn/server-side/express_nodejs/displaying_data/template_primer/index.html @@ -15,7 +15,7 @@

      Express 模板选择

      注意: 使用 Pug 的缺点,是它对缩进和空格敏感(如果在错误的位置添加额外的空格,可能会得到没什么帮助的错误代码)。但是,一旦您的模板到位,它们就很容易阅读和维护。

      -

      模板组态

      +

      模板组态

      在我们创建骨架网站时,LocalLibrary 配置为使用 Pug。您应该看到 Pug 模块作为依赖项,包含在网站的 package.json文件中,以及 app.js文件中的以下配置设置。设置告诉我们,使用 Pug 作为视图引擎,Express 应该在 /views子目录中搜索模板。

      @@ -32,7 +32,7 @@

      模板组态

      layout.pug -

      模板语法

      +

      模板语法

      下面的示例模板文件,展示了许多 Pug 最有用的功能。

      @@ -117,7 +117,7 @@

      模板语法

      语法还支持注释(可以在输出中呈现 - 或者不是 - 可自行选择),支持 mixins 创建可重用的代码块,case 语句和许多其他功能。有关更多详细信息,请参阅Pug文档。

      -

      扩展模板

      +

      扩展模板

      在一个站点中,通常所有页面都有一个共同的结构,包括页首,页脚,导航等的标准 HTML 标记。比起强迫开发人员在每个页面中复制这个“样板”的做法,Pug 允许你声明一个基本模板,然后扩展它,只替换每个特定页面不同的地方。

      diff --git a/files/zh-cn/learn/server-side/express_nodejs/forms/create_author_form/index.html b/files/zh-cn/learn/server-side/express_nodejs/forms/create_author_form/index.html index cc88d7721c6301..461bda9b896877 100644 --- a/files/zh-cn/learn/server-side/express_nodejs/forms/create_author_form/index.html +++ b/files/zh-cn/learn/server-side/express_nodejs/forms/create_author_form/index.html @@ -5,7 +5,7 @@ ---

      Ed本章节演示,如何为创建作者对象Author定义一个页面。

      -

      导入验证和清理方法

      +

      导入验证和清理方法

      为了在种类表单使用 express 验证器,我们必须用 require 导入我们想用的函式。

      @@ -14,7 +14,7 @@

      导入验证和
      const { body,validationResult } = require('express-validator/check');
       const { sanitizeBody } = require('express-validator/filter');
      -

      控制器—get 路由

      +

      控制器—get 路由

      找到导出的 author_create_get()控制器方法,并替换为底下代码。这里单纯呈现 author_form.pug 视图,传送 title 变数。

      @@ -23,7 +23,7 @@

      控制器—get 路由 res.render('author_form', { title: 'Create Author'}); }; -

      控制器—post 路由

      +

      控制器—post 路由

      找到导出的 author_create_post() 控制器方法,并替换为底下代码。

      @@ -103,7 +103,7 @@

      控制器—post 路 -

      视图

      +

      视图

      创建 /views/author_form.pug 并复制贴上以下文字。

      @@ -137,7 +137,7 @@

      自我挑战:加入死亡日期

      上面的模板少了一个输入字段 date_of_death 。依照跟生日表单同样的模式,创建此字段!

      -

      它看起來像是?

      +

      它看起來像是?

      运行本应用,打开浏览器访问网址http://localhost:3000/,然后点击创建新作者 Create new author 连结。如果每个东西都设定正确了,你的网站看起应该像底下的截图。在你输入一个值之后,它应该会被储存,并且你将被带到作者详细信息页面。

      diff --git a/files/zh-cn/learn/server-side/express_nodejs/forms/create_book_form/index.html b/files/zh-cn/learn/server-side/express_nodejs/forms/create_book_form/index.html index 8f9558739f22bf..5b2ff7c6cca24a 100644 --- a/files/zh-cn/learn/server-side/express_nodejs/forms/create_book_form/index.html +++ b/files/zh-cn/learn/server-side/express_nodejs/forms/create_book_form/index.html @@ -5,14 +5,14 @@ ---

      Edit 此子文档显示如何定义页面/表单以创建Book对象。这比相同的作者Author或种类Genre页面稍微复杂一点,因为我们需要在我们的书本表单中,获取并显示可用的作者和种类记录。

      -

      导入验证和清理方法

      +

      导入验证和清理方法

      打开 /controllers/bookController.js,并在文件顶部添加以下行:

      const { body,validationResult } = require('express-validator/check');
       const { sanitizeBody } = require('express-validator/filter');
      -

      控制器—get 路由

      +

      控制器—get 路由

      找到导出的book_create_get() 控制器方法,并将其替换为以下代码。

      @@ -36,7 +36,7 @@

      控制器—get 路由

      这使用异步模块 async(在教程 5:显示数据库中的数据),来获取所有作者和种类对象。然后将它们作为名为authorsgenres的变量(以及页面标题title),传递给视图book_form.pug

      -

      控制器—post 路由

      +

      控制器—post 路由

      找到导出的book_create_post()控制器方法,并将其替换为以下代码。

      @@ -145,7 +145,7 @@

      控制器—post 路 } } -

      视图

      +

      视图

      创建 /views/book_form.pug,并复制下面的文本。

      @@ -199,7 +199,7 @@

      视图

      -

      它看起來像是?

      +

      它看起來像是?

      运行应用程序,将浏览器打开到http://localhost:3000,然后选择 Create new book 链接。如果一切设置正确,您的网站应该类似于以下屏幕截图。提交有效的图书后,应将其保存,然后您将进入图书详细信息页面。

      diff --git a/files/zh-cn/learn/server-side/express_nodejs/forms/create_bookinstance_form/index.html b/files/zh-cn/learn/server-side/express_nodejs/forms/create_bookinstance_form/index.html index 1d49bb9c7813dc..4a8055b36646f8 100644 --- a/files/zh-cn/learn/server-side/express_nodejs/forms/create_bookinstance_form/index.html +++ b/files/zh-cn/learn/server-side/express_nodejs/forms/create_bookinstance_form/index.html @@ -5,14 +5,14 @@ ---

      Edi本章节演示如何定义一个页面/表单,以创建BookInstance 物件。这很像我们用来创建书本 Book 物件的表单。

      -

      导入验证和清理方法

      +

      导入验证和清理方法

      打开 /controllers/bookinstanceController.js,并在档案最上方加入以下几行:

      const { body,validationResult } = require('express-validator/check');
       const { sanitizeBody } = require('express-validator/filter');
      -

      控制器—get 路由

      +

      控制器—get 路由

      在档案最上方,用 require 导入书本模型 (因为每个BookInstance 都有关连的 Book)。

      @@ -34,7 +34,7 @@

      控制器—get 路由

      控制器取得所有书本的列表 (book_list) 并将它传送到视图 bookinstance_form.pug (里面附加上 title)。

      -

      控制器—post 路由

      +

      控制器—post 路由

      找到导出的  bookinstance_create_post() 控制器方法,并替换为底下代码。

      @@ -89,7 +89,7 @@

      控制器—post 路

      此代码的结构和行为,与创建其他对象的结构和行为相同。首先,我们验证数据,并為数据做無害化處理。如果数据无效,我们会重新显示表單,以及用户最初输入的数据,還有错误消息列表。如果数据有效,我们保存新的BookInstance记录,并将用户重定向到详细信息页面。

      -

      视图

      +

      视图

      创建 /views/bookinstance_form.pug ,并复制贴上以下代码。

      @@ -136,7 +136,7 @@

      视图

      注意: 以上的模板将状态值 (Maintenance, Available, 等等) 写死在代码里,而且不能 "记忆" 使用者的输入值。如果你愿意的话,考虑重新实作此列表,当表单被重新呈现时,从控制器传入选项数据,并设定选中的值。

      -

      它看起來像是?

      +

      它看起來像是?

      运行本应用,打开浏览器访问网址 http://localhost:3000/。然后点击创建新书本实例 Create new book instance (copy) 连结。如果每个东西都设定正确了,你的网站看起应该像底下的截图。在你提交一个有效的 BookInstance 之后,它应该会被储存,并且你将被带到详细信息页面。

      diff --git a/files/zh-cn/learn/server-side/express_nodejs/forms/create_genre_form/index.html b/files/zh-cn/learn/server-side/express_nodejs/forms/create_genre_form/index.html index 09dfd1d3942788..535b25024f124e 100644 --- a/files/zh-cn/learn/server-side/express_nodejs/forms/create_genre_form/index.html +++ b/files/zh-cn/learn/server-side/express_nodejs/forms/create_genre_form/index.html @@ -5,7 +5,7 @@ ---

      本章节演示如何定义我们的页面,创建Genre 物件(这是一个很好的起点,因为类型只有一个字段,它的名称name,没有依赖项)。像任何其他页面一样,我们需要设置路由,控制器和视图。

      -

      引入验证与无害化方法

      +

      引入验证与无害化方法

      在我们的控制器中使用 express-validator 验证器,我們必須导入我们想要从 'express-validator/check' 和 'express-validator/filter' 模块中使用的函数。

      @@ -14,7 +14,7 @@

      引入验证
      const { body,validationResult } = require('express-validator/check');
       const { sanitizeBody } = require('express-validator/filter');
      -

      控制器—get 路由

      +

      控制器—get 路由

      找到导出的genre_create_get() 控制器方法,并将其替换为以下代码。这只是渲染genre_form.pug视图,传递一个 title 变量。

      @@ -23,7 +23,7 @@

      控制器—get 路由< res.render('genre_form', { title: 'Create Genre' }); }; -

      控制器—post 路由

      +

      控制器—post 路由

      找到导出的genre_create_post()控制器方法,并将其替换为以下代码。

      @@ -152,7 +152,7 @@

      控制器—post 路

      在我们所有的 POST控制器中,都使用了相同的模式:我们运行验证器,然后运行消毒器,然后检查错误,并使用错误信息重新呈现表单,或保存数据。

      -

      视图

      +

      视图

      当我们创建一个新的种类Genre时,在GETPOST控制器/路由中,都会呈现相同的视图(稍后在我们更新种类Genre时也会使用它)。

      @@ -191,7 +191,7 @@

      视图

      注意: 这只是呈现错误的一种方法。您还可以从错误变量中,获取受影响字段的名称,并使用这些,来控制错误消息的呈现位置,以及是否应用自定义 CSS 等。

      -

      它看起來像是?

      +

      它看起來像是?

      运行应用程序,打开浏览器到http://localhost:3000/,然后选择 Create new genre 链接。如果一切设置正确,您的网站应该类似于以下屏幕截图。输入值后,应保存该值,您将进入种类详细信息页面。

      diff --git a/files/zh-cn/learn/server-side/express_nodejs/forms/delete_author_form/index.html b/files/zh-cn/learn/server-side/express_nodejs/forms/delete_author_form/index.html index c82ca794211993..ba935f634d66ba 100644 --- a/files/zh-cn/learn/server-side/express_nodejs/forms/delete_author_form/index.html +++ b/files/zh-cn/learn/server-side/express_nodejs/forms/delete_author_form/index.html @@ -7,7 +7,7 @@

      正如表单设计部分所讨论的那样,我们的策略是,只允许删除“未被其他对象引用”的对象(在这种情况下,这意味着如果作者Author被一本书Book引用,我们将不允许删除作者)。在实现方面,这意味着,表单需要在删除作者之前,先确认没有关联的书籍。如果存在关联的书籍,则应显示它们,并说明在删除Author对象之前,必须删除它们。

      -

      控制器—get 路由

      +

      控制器—get 路由

      打开/controllers/authorController.js。找到导出的author_delete_get() 控制器方法,并将其替换为以下代码。

      @@ -44,7 +44,7 @@

      控制器—get 路由 } -

      控制器—post 路由

      +

      控制器—post 路由

      找到导出的author_delete_post()控制器方法,并将其替换为以下代码。

      @@ -83,7 +83,7 @@

      控制器—post 路

      注意: 我们可以检查对findById()的调用,是否返回任何结果,如果没有,则立即呈现所有作者的列表。为简洁起见,我们将代码保留在上面(如果找不到 id,它仍会返回作者列表,但这将在findByIdAndRemove()之后发生)。

      -

      视图

      +

      视图

      创建 /views/author_delete.pug 并复制贴上底下文字。

      @@ -123,7 +123,7 @@

      视图

    5. 如果没有书本,则页面会显示确认提示。如果单击“删除”Delete按钮,则会在POST请求中,将作者 ID 发送到服务器,并且将删除该作者的记录。
    6. -

      加入一个删除控制器

      +

      加入一个删除控制器

      接下来,我们将向 Author 详细视图添加 Delete 控件(详细信息页面是删除记录的好地方)。

      @@ -141,7 +141,7 @@

      加入一个删

      -

      它看起來像是?

      +

      它看起來像是?

      运行应用程序,并将浏览器打开,到http://localhost:3000/。然后选择所有作者链接 All authors,然后选择一个特定作者。最后选择删除作者链接 Delete author。

      diff --git a/files/zh-cn/learn/server-side/express_nodejs/forms/update_book_form/index.html b/files/zh-cn/learn/server-side/express_nodejs/forms/update_book_form/index.html index dea22b0e331900..7d24b4fb9f9469 100644 --- a/files/zh-cn/learn/server-side/express_nodejs/forms/update_book_form/index.html +++ b/files/zh-cn/learn/server-side/express_nodejs/forms/update_book_form/index.html @@ -5,7 +5,7 @@ ---

      Edit本文最后一部分演示如何定义一个页面,以更新书本(Book)对象。当更新一本书的时候,表单处理更像是创建一本书,除了你必须将表单填进 GET 路由,并附加上来自数据库的值。

      -

      控制器—get 路由

      +

      控制器—get 路由

      打开 /controllers/bookController.js. 找到 exported book_update_get() 控制方法,并用底下的代码替换。

      @@ -46,7 +46,7 @@

      控制器—get 路由

      这个控制器从 URL 参数 (req.params.id) 中,取得要更新的书本 Book 的 id。它使用 async.parallel()方法,取得指定的书本 Book 纪录 (填入它的种类和作者字段) ,并列出所有作者 Author 和种类 Genre对象。当所有操作都完成,它用勾选的方式,标记当前选择的种类,并呈现 book_form.pug 视图,传送变数 titlebook、所有 authors、所有 genres

      -

      控制器—post 路由

      +

      控制器—post 路由

      找到 exported book_update_post() 控制器方法,并替换为底下的代码。

      @@ -130,7 +130,7 @@

      控制器—post 路

      这很像是创建一本书的时候,所使用的 post 路由。首先,我们验证来自表单的书本数据,并进行无害化处理,并使用它创建一个新的书本 Book 对象 (将它的 _id 值,设置给将要更新的对象的 id)。当我们验证资料,然后重新呈现表单的时候,如果存在错误,再附加显示使用者输入的资料、错误信息、以及种类和作者列表。当我们调用Book.findByIdAndUpdate() 去更新 Book ,如果没有错误,就重新导向到它的细节页面。

      -

      视图

      +

      视图

      打开 /views/book_form.pug ,并更新作者表单控制器的区段,以加入底下条件控制代码。

      @@ -154,7 +154,7 @@

      视图

      注意: 此处代码的更动,是为了让书本表单 book_form,能被创建和更新书本的对象共同使用 (如果不这么做,当创建表单时,在 GET 路由会发生一个错误)。

      -

      加入一个更新按钮

      +

      加入一个更新按钮

      打开 book_detail.pug 视图,并确认在页面下方,有删除和更新书本的连结,如下所示。

      @@ -166,7 +166,7 @@

      加入一个更新

      你现在应该能够更新来自书本细节页面的书了。

      -

      它看起來像是?

      +

      它看起來像是?

      运行本应用,打开浏览器,访问网址 http://localhost:3000/,点击所有书本 All books 连结,然后点击一本书。最后点击更新书本 Update Book 连结。

      diff --git a/files/zh-cn/mdn/contribute/howto/tag/index.html b/files/zh-cn/mdn/contribute/howto/tag/index.html index 388c71788aa5ba..b26d4c11f47e29 100644 --- a/files/zh-cn/mdn/contribute/howto/tag/index.html +++ b/files/zh-cn/mdn/contribute/howto/tag/index.html @@ -115,7 +115,7 @@

      主题

      一般而言,您的主题标识标签应该是一个接口的名称,和相关的页面(如Node,它的各种属性和方法有很多页),或一个整体的技术类型的名称。你可以对图形、WebGL 和 WebGL 设置页面标签,而不仅是一个关于{{HTMLElement("canvas")}} 与 HTML、元素,Canvas,和图形。

      -

      Mozilla 特定内容

      +

      Mozilla 特定内容

      这些标签只用于 Mozilla 特定内容:

      diff --git a/files/zh-cn/mozilla/firefox/releases/1.5/using_firefox_1.5_caching/index.html b/files/zh-cn/mozilla/firefox/releases/1.5/using_firefox_1.5_caching/index.html index 05e840ec96b32a..c0b8389d757782 100644 --- a/files/zh-cn/mozilla/firefox/releases/1.5/using_firefox_1.5_caching/index.html +++ b/files/zh-cn/mozilla/firefox/releases/1.5/using_firefox_1.5_caching/index.html @@ -3,7 +3,7 @@ slug: Mozilla/Firefox/Releases/1.5/Using_Firefox_1.5_caching translation_of: Mozilla/Firefox/Releases/1.5/Using_Firefox_1.5_caching --- -
      {{FirefoxSidebar}}

      介绍

      +
      {{FirefoxSidebar}}

      介绍

      Firefox 1.5 对整个 web 页面的一个浏览器会话进行了内存缓存,包括他们对 JavaScript 状态。在访问过的页面间后退和前进不需要页面加载同时保存 JavaScript 状态。这个特性,被称为 bfcache(“后退前进缓存”),使得页面导航(切换)非常快。这个状态缓存被保存直到用户关闭浏览器。 

      @@ -34,7 +34,7 @@

      两个新的浏览器事件使得用户可以做到这 2 个要求。

      -

      新的浏览器事件

      +

      新的浏览器事件

      如果你使用新的事件,你的页面在其他浏览器依然会正确显示  (我们已经测试了早期版本的 Firefox, Internet Explorer, Opera, 和 Safari),而且在 Firefox 1.5 加载时将会使用新的缓存功能。

      @@ -56,7 +56,7 @@

      新的浏览器事件

      如果你拥有当用户导航离页面是执行的行为,但是你想利用这个新的缓存功能,因此不想使用 unload 处理程序,使用新的 pagehide 事件

      -

      pageshow 事件

      +

      pageshow 事件

      这个事件和 load 事件一样的工作(效果), 除了它每次页面加载是都执行 that it fires every time the page is loaded (然而  load 事件在 Firefox 1.5 中当页面从缓存中加载时不执行). 页面第一次加载时, pageshow 事件在 load 事件执行后执行。 pageshow 事件使用一个命名为persisted 的 boolean 属性,在初始加载时默认设置为 false。如果它不是初始加载,被设置为true(换句话说,但页面被缓存时它被设置为 true).

      @@ -64,7 +64,7 @@

      pageshow 事件

      如果你将 JavaScript 函数作为 pageshow 事件的一部分调用,你可以通过调用pageshow 事件作为load事件的一部分确保在不同于 Firefox 1.5 的浏览器在页面加载时调用这些函数,如在本文后面所示的示例。

      -

      pagehide 事件

      +

      pagehide 事件

      如果你想定义当用户导航离页面时的行为,但是你不想使用 unload  (这将导致页面不被缓存),你可以使用新的  pagehide 事件。像 pageshow , pagehide 事件使用一个命名为persisted 的属性。这个属性在页面未被浏览器缓存时设置为 false  ,如果页面被浏览器缓存则设置为 true 。如果这个属性被设置为 false,如果有设置unload 处理程序的话,unload 事件在pagehide 事件执行后马上执行。

      @@ -177,7 +177,7 @@

      示例代码

      <body onload="onLoad();"> -

      开发 Firefox 扩展

      +

      开发 Firefox 扩展

      Firefox 1.5 extensions 需要允许缓存功能。如果你在开发一个兼容 1.5 及以前版本的 Firefox 扩展,确保它监听事件触发 load 可被缓存,监听的 pageshow 事件触发不应该被缓存。

      diff --git a/files/zh-cn/mozilla/firefox/releases/14/index.html b/files/zh-cn/mozilla/firefox/releases/14/index.html index 79eb5cb3df3869..57256380326ebb 100644 --- a/files/zh-cn/mozilla/firefox/releases/14/index.html +++ b/files/zh-cn/mozilla/firefox/releases/14/index.html @@ -79,7 +79,7 @@

      XUL

    7. 在 {{ XULElem("window") }}元素上添加了新的 {{ XULAttr("fullscreenbutton") }}属性; 将该属性设置为true,会在窗口上添加一个进入全屏模式的按钮。
    8. -

      接口

      +

      接口

      • nsILocalFile接口被合并到nsIFile接口中。(bug 682360).
      • diff --git a/files/zh-cn/mozilla/firefox/releases/26/index.html b/files/zh-cn/mozilla/firefox/releases/26/index.html index 16301c10bf7560..828f55e430f016 100644 --- a/files/zh-cn/mozilla/firefox/releases/26/index.html +++ b/files/zh-cn/mozilla/firefox/releases/26/index.html @@ -3,7 +3,7 @@ slug: Mozilla/Firefox/Releases/26 translation_of: Mozilla/Firefox/Releases/26 --- -
        {{FirefoxSidebar}}

        Web 开发者需要注意的变化

        +
        {{FirefoxSidebar}}

        Web 开发者需要注意的变化

        CSS

        •  text-decoration-line 属性仍然带有前缀,不过现在它把 'blink' 也看看成了它的合法属性值,虽然并不会真正的让内容产生闪烁效果 ({{bug("812995")}}).
        • diff --git a/files/zh-cn/mozilla/firefox/releases/3/index.html b/files/zh-cn/mozilla/firefox/releases/3/index.html index 065a3b6f685a7b..641c565a77e843 100644 --- a/files/zh-cn/mozilla/firefox/releases/3/index.html +++ b/files/zh-cn/mozilla/firefox/releases/3/index.html @@ -7,8 +7,8 @@ ---
          {{FirefoxSidebar}}

          如果你是一个 Web 开发人员,并且希望了解 Firefox 3 中所有的新特性,这里是一个很好的起点。这篇文章提供了一个覆盖所有 Firefox 3 新特性的列表。虽然他并不是能够包括所有微小的改动,但他能够帮助你学习到最主要的更新。

           

          -

          Firefox 3 中新的开发人员特性

          -

          对网站和程序开发者

          +

          Firefox 3 中新的开发人员特性

          +

          对网站和程序开发者

          更新 WEB 应用以适应 Firefox 3
          @@ -114,7 +114,7 @@

          对 XUL 和扩展插件的开发者

          +

          对 XUL 和扩展插件的开发者

           

          @@ -253,8 +253,8 @@

          最终用户将能体验到的新特性

          -

          用户体验

          +

          最终用户将能体验到的新特性

          +

          用户体验

          • 更轻松的密码管理。 当你成功登陆之后在浏览器顶端会出现一个信息栏,提示你是否保存此口令。
          • 附件组件安装更简便。 你可以更容易的通过第三方下载附件组件并安装它。
          • @@ -281,7 +281,7 @@

            安全和隐私

            +

            安全和隐私

            • 一键网站信息。 想知道更多关于您所访问网站的信息?点击该网站的图标,在地址栏中看看是谁拥有它。信息更易理解。
            • 恶意软件防护。如果你访问了一个已知的安装病毒,间谍软件,木马,或其他危险软件(也称为恶意软件)的网站 Firefox 3 会警告你。你可以点这里看看警告是怎样的。
            • @@ -294,13 +294,13 @@

              性能

              +

              性能

              • 可靠性。Firefox 3 使用安全的数据库格式保存书签,历史记录,cookies,及偏好。这意味着,即使系统崩溃,您的数据也免受损失。
              • 速度。 Firefox 3 有了较大的性能提升,完全取代了部分软件:包括图形屏幕处理,以及页面布局工作的处理等。
              • 更少的内存占用。 Firefox 3 的内存使用比以往任何时候都有效,有超过 300 个内存“泄漏”漏洞得以修复,以及可帮助自动查找和处置泄漏内存的新功能被添加进来。
              -

              参见

              +

              参见

              • 对 Firefox 3 的扩展进行更新
              • 对 Firefox 3 的 Web 应用进行更新
              • diff --git a/files/zh-cn/mozilla/firefox/releases/3/site_compatibility/index.html b/files/zh-cn/mozilla/firefox/releases/3/site_compatibility/index.html index 6baf2738cfc78b..217d003c6120fc 100644 --- a/files/zh-cn/mozilla/firefox/releases/3/site_compatibility/index.html +++ b/files/zh-cn/mozilla/firefox/releases/3/site_compatibility/index.html @@ -5,8 +5,8 @@ ---
                {{FirefoxSidebar}}

                此页设法提供在 Gecko 1.8 和 Gecko 1.9 之间的变动概要,这些变动可能会影响某些网站的行为或网页渲染。

                参见 Firefox 3 开发者参考

                -

                事件

                -

                捕获 load 事件监听

                +

                事件

                +

                捕获 load 事件监听

                在 Gecko 1.8 中,不能在图片上设置 load 事件监听。在 Gecko 1.9 中,已在 {{ Bug(234455) }} 中修复。但是在某些网站中,由于捕获 load 事件的事件监听器不正确而导致问题。参见 {{ Bug(335251) }} 中的讨论。要修复这个问题,出错的页面不再需要设置事件监听器。

                例如,如下:

                window.addEventListener('load', yourFunction, true);
                @@ -15,12 +15,12 @@ 

                window.addEventListener('load', yourFunction, false);

                事件捕获如何工作的解释,参见 DOM Level 2 事件捕获

                -

                preventBubble 已被移出

                -

                少许旧的事件 API 不再被支持

                -

                DOM

                -

                WRONG_DOCUMENT_ERR

                -

                范围

                -

                intersectsNode 已被移出

                -

                compareNode 已被移出

                -

                HTML

                -

                <object> 中的许多 bug 已经修复

                +

                preventBubble 已被移出

                +

                少许旧的事件 API 不再被支持

                +

                DOM

                +

                WRONG_DOCUMENT_ERR

                +

                范围

                +

                intersectsNode 已被移出

                +

                compareNode 已被移出

                +

                HTML

                +

                <object> 中的许多 bug 已经修复

                diff --git a/files/zh-cn/mozilla/firefox/releases/3/updating_extensions/index.html b/files/zh-cn/mozilla/firefox/releases/3/updating_extensions/index.html index 07d433a0a3ac3d..8c5c647d552975 100644 --- a/files/zh-cn/mozilla/firefox/releases/3/updating_extensions/index.html +++ b/files/zh-cn/mozilla/firefox/releases/3/updating_extensions/index.html @@ -66,7 +66,7 @@

                在进入主题之前,首先要提示一下:如果你的扩展所需要的唯一改变只是安装文件中的maxVersion信息,并且你的扩展所在的主机是addons.mozilla.org,事实上你不需要上传你的新的版本的扩展!只需要在 AMO 中使用开发者控制面板调整maxVersion。通过这种方式你可以避免你的扩展被再次审核。

                -

                第一步:升级安装文件

                +

                第一步:升级安装文件

                第一步,当然,对于大多数的扩展也仅需要这一步——更新安装文件install.rdf,声明扩展兼容 Firefox 3。

                @@ -91,19 +91,19 @@

                Note: If your extension still uses an Install.js script instead of an install manifest, you need to make the transition to an install manifest now. Firefox 3 no longer supports install.js scripts in XPI files.

      -

      Add localizations to the install manifest

      +

      Add localizations to the install manifest

      Firefox 3 supports new properties in the install manifest to specify localized descriptions. The old methods still work however the new allow Firefox to pick up the localizations even when the add-on is disabled and pending install. See Localizing extension descriptions for more details.

      -

      Step 2: 确保提供安全的更新

      +

      Step 2: 确保提供安全的更新

      If you are hosting addons yourself and not on a secure add-on hosting provider like addons.mozilla.org then you must provide a secure method of updating your add-on. This will either involve hosting your updates on an SSL website, or using cryptographic keys to sign the update information. Read Securing Updates for more information.

      -

      Step 3: Deal with changed APIs

      +

      Step 3: Deal with changed APIs

      Several APIs have been changed in significant ways. The most significant of these, which will likely affect a large number of extensions, are:

      -

      DOM

      +

      DOM

      将外部文档的节点插入当前文档之前,你必须使用 document.importNode() 从外部文档导入源节点,或者使用 document.adoptNode()导入源节点, @@ -112,15 +112,15 @@

      DOM

      即使你不执行导入动作,就执行插入外部文档中的节点.Firefox 目前也不会报错 (如果严格按标准执行,很多已有的网站都无法正常运行). 我们鼓励开发者严格按标准修改自己已有的不符合上述标准的代码。

      -

      Bookmarks & History

      +

      Bookmarks & History

      If your extension accesses bookmark or history data in any way, it will need substantial work to be compatible with Firefox 3. The old APIs for accessing this information have been replaced by the new Places architecture. See the Places migration guide for details on updating your existing extension to use the Places API.

      -

      Download Manager

      +

      Download Manager

      The Download Manager API has changed slightly due to the transition from an RDF data store to using the Storage API. This should be a pretty easy transition to make. In addition, the API for monitoring download progress has changed to support multiple download manager listeners. See nsIDownloadManager, nsIDownloadProgressListener, and Monitoring downloads for more information.

      -

      Password Manager

      +

      Password Manager

      If your extension accesses user login information using the Password Manager, it will need to be updated to use the new Login Manager API.

      @@ -132,15 +132,15 @@

      Password Manager

      You can also override the built-in password manager storage if you want to provide your own password storage implementation in your extensions. See Creating a Login Manager storage module for details.

      -

      Popups (Menus, Context Menus, Tooltips and Panels)

      +

      Popups (Menus, Context Menus, Tooltips and Panels)

      The XUL Popup system was heavily modified in Firefox 3. The Popup system includes main menus, context menus and popup panels. A guide to using Popups has been created, detailing how the system works. One thing to note is that popup.showPopup has been deprecated in favor of new popup.openPopup and popup.openPopupAtScreen.

      -

      Autocomplete

      +

      Autocomplete

      The nsIAutoCompleteController interface's handleEnter() method has been changed to accept an argument that indicates whether the text was selected from the autocomplete popup or by the user pressing enter after typing text.

      -

      DOMParser

      +

      DOMParser

      -

      Removed interfaces

      +

      Removed interfaces

      The following interfaces were removed from Gecko 1.9, which drives Firefox 3. If your extension makes use of any of these, you'll need to update your code:

      @@ -166,7 +166,7 @@

      Removed interfaces

    9. nsICloseAllWindows (see bug 386200)
    10. -

      Step 4: Check for relevant chrome changes

      +

      Step 4: Check for relevant chrome changes

      There has been a minor change to the chrome that may require changes in your code. A new vbox has been added, called "browser-bottombox", which encloses the find bar and status bar at the bottom of the browser window. Although this doesn't affect the appearance of the display, it may affect your extension if it overlays chrome relative to these elements.

      @@ -195,7 +195,7 @@

      Note: This change is effective for Firefox 3 beta 4 and the pre-beta 4 nightlies. -

      其他方面的修改

      +

      其他方面的修改

      Add simple changes you had to make while updating your extension to work with Firefox 3 here.

      diff --git a/files/zh-cn/web/accessibility/aria/attributes/aria-hidden/index.html b/files/zh-cn/web/accessibility/aria/attributes/aria-hidden/index.html index b7239c7de2e26f..46114d1715c851 100644 --- a/files/zh-cn/web/accessibility/aria/attributes/aria-hidden/index.html +++ b/files/zh-cn/web/accessibility/aria/attributes/aria-hidden/index.html @@ -83,9 +83,9 @@

      最佳实践

      在以上三个场景中,元素已经被隐藏,从可访问树种移除了,无需再添加aria-hidden="true"属性。

      -

      技术规格

      +

      技术规格

      -

      另见

      +

      另见