From 33058f2b292b3a581333bdfb21b8f671898c5060 Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:40:17 -0500 Subject: initial commit --- .../e4x_tutorial/accessing_xml_children/index.html | 111 +++++++++++++++++++++ .../descendants_and_filters/index.html | 27 +++++ files/zh-cn/archive/web/e4x_tutorial/index.html | 39 ++++++++ .../web/e4x_tutorial/introduction/index.html | 64 ++++++++++++ .../archive/web/e4x_tutorial/namespaces/index.html | 33 ++++++ .../e4x_tutorial/the_global_xml_object/index.html | 55 ++++++++++ 6 files changed, 329 insertions(+) create mode 100644 files/zh-cn/archive/web/e4x_tutorial/accessing_xml_children/index.html create mode 100644 files/zh-cn/archive/web/e4x_tutorial/descendants_and_filters/index.html create mode 100644 files/zh-cn/archive/web/e4x_tutorial/index.html create mode 100644 files/zh-cn/archive/web/e4x_tutorial/introduction/index.html create mode 100644 files/zh-cn/archive/web/e4x_tutorial/namespaces/index.html create mode 100644 files/zh-cn/archive/web/e4x_tutorial/the_global_xml_object/index.html (limited to 'files/zh-cn/archive/web/e4x_tutorial') diff --git a/files/zh-cn/archive/web/e4x_tutorial/accessing_xml_children/index.html b/files/zh-cn/archive/web/e4x_tutorial/accessing_xml_children/index.html new file mode 100644 index 0000000000..16b4cf8139 --- /dev/null +++ b/files/zh-cn/archive/web/e4x_tutorial/accessing_xml_children/index.html @@ -0,0 +1,111 @@ +--- +title: Accessing XML children +slug: Archive/Web/E4X_tutorial/Accessing_XML_children +translation_of: Archive/Web/E4X_tutorial/Accessing_XML_children +--- +

访问 XML 子节点

+

JavaScript 对象通常使用 . 或 [] 来设置性质。

+
var a = {};
+a.foo = 1;
+a["bar"] = 2;
+

在 E4X 中，点（.）和中括号（[]）操作符用来访问 E4X 元素的子节点。

+
var element1 = <foo>
+                 <bar/>
+               </foo>;
+var element2 = <baz/>;
+element1.bar.appendChild(element2);
+element1["bar"].appendChild(<quux/>);
+

往 element1 中的 bar 节点添加子节点，生成如下 XML 文档：

+

<foo>
+   <bar>
+     <baz/>
+     <quux/>
+   </bar>
+ </foo>

+

但是要注意，给一个不存在的子元素赋值会创建这个元素。

+
var element1 = <foo/>
+element1.bar = 1;
+

生成

+

<foo>
+   <bar>1</bar>
+ </foo>

+

如果子节点已经存在，点（.）操作符允许你更改它的值。

+
var elem = <foo>
+             <bar>1</bar>
+           </foo>
+elem.bar = 2;
+

会将原来的值 1 改成 2。

+

你可以用 delete 命令删除一个子节点。

+
var elem = <foo>
+             <bar/>
+             <baz/>
+           </foo>
+delete elem.bar;
+

只剩下

+

<foo>
+   <baz/>
+ </foo>

+

点（.）操作符还能用于替换特定的子节点。

+
var elem1 = <foo>
+              <bar/>
+            </foo>;
+var elem2 = <red>
+              <blue/>
+            </red>;
+elem1.bar = elem2;
+

用 elem2 的全部内容替换 <bar/> 元素。

+

<foo>
+   <red>
+     <blue/>
+   </red>
+ <foo>

+

XML 列表

+

许多时候，一个元素会有两个或多个相同类型的子节点。在这种情况下，访问 foo.bar 将返回一个XML 列表对象，包含所有类型为“bar”的子节点。注意：在使用 . 操作符时，判断它是返回单个元素还是一个 XML 列表，这是你的责任。在返回这些性质时，E4X 的行为并没有区别。

+

XML 列表的行为就像是一个数组。

+
var element = <foo>
+                <bar baz="1">red</bar>
+                <bar baz="2">blue</bar>
+              </foo>;
+var list = element.bar;
+list.length(); // returns 2
+list[0]; // the first bar element
+list[1]; // the second bar element
+
+

需要注意，这个列表时可修改的，在它上面做的修改都会反映到原始的 XML 文档中。

+
list[1] = "green";
+

XML 文档被修改为：

+

<foo>
+   <bar baz="1">red</bar>
+   <bar baz="2">green</bar>
+ </foo>

+

特殊类型的节点

+

XML 对象有一些方法可以访问 XML 列表中的通用类型节点。

+
var a = <foo> Some text <bar>not text</bar> More text </foo>;
+var list = a.text();
+list.length(); // returns 2
+list[0]; // returns " Some text "
+list[1]; // returns " More text "
+

你同样可以访问注释节点：

+
XML.ignoreComments = false;
+var a = <foo> Some  <!-- abc --> text </foo>;
+var comments = a.comments();
+alert(comments[0]); // Returns <!-- abc -->
+

星号（*）选择器将返回 XML 列表的所有子节点。

+
var a = <foo>
+          <bar/>
+          <baz/>
+        </foo>;
+var list = a.*;
+list.length(); // returns 2
+
+

元素属性

+

很多 XML 元素都有赋有特定值的属性。例如：

+

<pets>
+   <dog color="brown">Fido</dog>
+   <cat color="grey">Fluffy</cat>
+ </pets>

+

E4X 运行你用 .@ 操作符来反问这些特定元素的属性。最基本的情况如下例所示：

+
 var element = <foo bar="1"/>
+ element.@bar = 2;
+

它将生成：

+

<foo bar="2"/>

diff --git a/files/zh-cn/archive/web/e4x_tutorial/descendants_and_filters/index.html b/files/zh-cn/archive/web/e4x_tutorial/descendants_and_filters/index.html new file mode 100644 index 0000000000..fbf89a871f --- /dev/null +++ b/files/zh-cn/archive/web/e4x_tutorial/descendants_and_filters/index.html @@ -0,0 +1,27 @@ +--- +title: Descendants and Filters +slug: Archive/Web/E4X_tutorial/Descendants_and_Filters +translation_of: Archive/Web/E4X_tutorial/Descendants_and_Filters +--- +

访问后代节点

+

很多时候，你感兴趣的节点往往不是 XML 根节点的子节点，而是嵌套在多层下的后代节点。你可以使用 .. 操作符访问任意深度的节点，或者使用 descendants 性质。例如：

+
var element = <pets>
+                <dogs>
+                  <fido color="red"/>
+		  <spike color="blue"/>
+		</dogs>
+              </pets>;
+element..fido.@color = "green";
+element..spike.@color = "purple";
+
+

两只宠物狗的颜色都做了改变。

+

点（.）操作符的所有规则都适用于 .. 操作符。那就是说，如果有多个请求的类型，就会返回一个 XML 后代的列表。星号（*）选择器会返回 XML 列表的所有后代。

+

过滤器

+

在很多情况下，尤其是用 * 选择器时，你并不想要处理 . 或 .. 操作符返回的所有节点。为了只处理其中特定的子集，可以将筛选条件放到 . 操作符后面的圆括号里。

+
var element = <dogs>
+                <fido color="brown"/>
+                <spike color="black"/>
+                <killer color="brown"/>
+              </dogs>;
+var list = element.*.(@color == "brown");
+

本来，element.* 返回一个包含三只狗的列表。但其中只有 fido 和 killer 的颜色是褐色的。因此，该过来条件创建了一个只包含 fido 和 killer 的列表。

diff --git a/files/zh-cn/archive/web/e4x_tutorial/index.html b/files/zh-cn/archive/web/e4x_tutorial/index.html new file mode 100644 index 0000000000..4dac9ce0e8 --- /dev/null +++ b/files/zh-cn/archive/web/e4x_tutorial/index.html @@ -0,0 +1,39 @@ +--- +title: E4X教程 +slug: Archive/Web/E4X_tutorial +translation_of: Archive/Web/E4X_tutorial +--- +

+

下一页 »

+

+ +
+

警告：E4X已废弃。 默认情况下，Firefox 16中的内容将禁用它，Firefox 17中的Chrome默认禁用，Firefox 18中将其删除。请使用DOMParser / DOMSerializer或非本机JXON算法。

+
+ +

概述

+ +

本教程带你走入E4X (EcmaScript for XML)基本语法. 通过使用E4X，程序员可以通过一个类似JavaScript编程的语法来操作XML文档。

+ +

科目

+ + + +

另请参阅

+ + + +

+

下一页 »

+

+ +

diff --git a/files/zh-cn/archive/web/e4x_tutorial/introduction/index.html b/files/zh-cn/archive/web/e4x_tutorial/introduction/index.html new file mode 100644 index 0000000000..2c0a2f7a76 --- /dev/null +++ b/files/zh-cn/archive/web/e4x_tutorial/introduction/index.html @@ -0,0 +1,64 @@ +--- +title: Introduction +slug: Archive/Web/E4X_tutorial/Introduction +tags: + - E4X + - JavaScript + - Tutorial +translation_of: Archive/Web/E4X_tutorial/Introduction +--- +

基本语法

+

如果启用了 E4X，基本的 XML 元素就是有效的语法。例如：

+
var element = <foo/>
+
+

在开启了 E4X 的浏览器里完全有效。

+

变量的声明也不局限于单个元素，并且和 JavaScript 一样可以扩多行。

+
var element2 = <foo>
+                     <bar/>
+               </foo>
+
+

此外，和一般的 XML 文档一样，你能给一个元素指定属性。

+
var element3 = <foo baz="1"/>
+
+

操作元素

+

E4X 的目标是为 JavaScript 程序员提供一个简单的方法来操作 XML 文档，而无需通过 DOM 接口。不过，很多你在 DOM 中用过的函数也能用到 E4X 中。最基本的就是 appendChild：

+
var element1 = <foo/>
+var element2 = <bar/>
+element1.appendChild(element2);
+
+

它会产生你期望的正确的 XML 文档：

+

<foo>
+   <bar/>
+ </foo>

+

JavaScript 变量

+

当 XML 文档需要和 JavaScript 做紧密交互时，E4X 真正强大的地方才得以彰显。通过特定的语法，我们能将 JavaScript 变量的值赋给 E4X 元素。这是用大括号（{}）标记。

+
var a = 2;
+var b = <foo>{a}</foo>;
+
+

创建了一段 XML 文档，内容为 <foo>2</foo>。

+

你也可以将大括号标记用于元素的属性（名字或值）。例如：

+
var a = 2;
+var b = 'bar';
+var c = <foo {b}={a}>"hi"</foo>;
+

创建的 XML 稍有不同：<foo bar="2">"hi"</foo>。

+

注意：XML 元素只接受文本作为他们的值。大括号标记真正发生的是调用变量的 toString 方法，并将返回值填到相应位置。例如：

+
var a = {foo: 1};
+var b = <bar>{a}</bar>
+

实际上产生的文档是 <bar>[object Object]</bar>。

+

在内容中使用内联函数

+

虽然大括号限定执行单条语句，但通过匿名函数内联可以执行一些额外的处理：

+
var a = 'foo';
+var b = <bar>{function () {var c = a.toUpperCase(); var d = 5 * 5; return c + d;}()}</bar>
+

上述代码产生：<bar>FOO25</bar>

+

该用法更多的讨论请参加 E4X for templating 。

+

序列化

+

E4X 最强大的工具就是简单地调用 .toXMLString() 就可以将整个 XML 文档（或其中部分）序列化到字符串中。

+
var element1 = <foo/>;
+var element2 = <bar/>;
+element1.apppendChild(element2);
+element1.toXMLString();
+

输出为：

+

<foo>
+   <bar/>
+ </foo>

+

本例使用 toString() 也能达到相同效果，不过在一个只有文本内容的元素上调用 toString() 将之产生文本内容（例如，<foo>abc</foo>.toString(); 会只产生 'abc'）。

diff --git a/files/zh-cn/archive/web/e4x_tutorial/namespaces/index.html b/files/zh-cn/archive/web/e4x_tutorial/namespaces/index.html new file mode 100644 index 0000000000..8a2fc96063 --- /dev/null +++ b/files/zh-cn/archive/web/e4x_tutorial/namespaces/index.html @@ -0,0 +1,33 @@ +--- +title: Namespaces +slug: Archive/Web/E4X_tutorial/Namespaces +translation_of: Archive/Web/E4X_tutorial/Namespaces +--- +

E4X 与 命令空间

+

通常情况下，XML 文档包含来自多种命令空间的元素。你可以通过声明为你的 E4X 对象设置默认的命名空间。

+
default xml namespace = "http://www.w3.org/1999/xhtml";
+
+

通过重复的声明，你可以随时更改相同范围内 E4X 的命名空间。

+
default xml namespace = "http://www.w3.org/1999/xhtml";
+var a = <p>Some text</p>;
+default xml namespace = "http://www.mozilla.org/keymaster/gat...re.is.only.xul";
+var b = <label>More text</label>;
+a.appendChild(b);
+
+

得出

+

<p xmlns="http://www.w3.org/1999/xhtml">
+   Some text
+   <label xmlns="http://www.mozilla.org/keymaster/gat...re.is.only.xul">More text</label>
+ </p>

+

name()

+

在 XML 对象上调用 name() 会返回一个 QName 对象（Qualified Name）。QName 在支持 E4X 的 JavaScript 实现中是一个全局的构造函数。QName 对象有两个特别重要的属性：localName 返回元素的名字，且没有任何命名空间前缀；uri 返回元素所在的命名空间。

+
var info = a.name();
+info.localName; // returns 'p'.
+info.uri; // returns "http://www.w3.org/1999/xhtml"
+

没有在任何命令空间的元素，他们的 uri 是一个空字符串。

+

Namespace 全局构造函数和 QName 非常相似。Namespace 的不同之处是 toString 方法，以及 Namespace 用 prefix 属性来代替 localName 属性[1] 。

+

关于 E4X 的命名空间，更多的内容请参见 Processing XML with E4X 。

+

译者注

+
    +
  1. 原文中没有详细讲，获得 Namespace 对象的方法是调用 .namespace()。其中 QName 的 toString 方法会输出 Namespace::name 的形式，而 Namespace 的 toString 只会输出命名空间。
    2. +
diff --git a/files/zh-cn/archive/web/e4x_tutorial/the_global_xml_object/index.html b/files/zh-cn/archive/web/e4x_tutorial/the_global_xml_object/index.html new file mode 100644 index 0000000000..910b422ada --- /dev/null +++ b/files/zh-cn/archive/web/e4x_tutorial/the_global_xml_object/index.html @@ -0,0 +1,55 @@ +--- +title: The global XML object +slug: Archive/Web/E4X_tutorial/The_global_XML_object +translation_of: Archive/Web/E4X_tutorial/The_global_XML_object +--- +

全局 XML 对象

+

E4X-capable JavaScript 引擎在全局对象上放了一个新的属性。XML 对象有许多属性允许你定制解析和序列化 E4X。XML 元素从他们创建开始就记住 XML 对象的设置。

+

扩展 XML.prototype

+

XML.prototype 和 XMLList.prototype（XMLList.prototype 实际上就是 XML.prototype）不能像其他构造器（例如 Object）一样扩展。你只能在 XML.prototype 里定义方法，而不能定义字段。要向 XML.prototype 添加一个方法，则要定义 XML.prototype.function::methodName 或 XML.prototype.funciton::[methodNameString]。下例定义 fooCount() 方法，返回 XML 中 <foo> 元素的个数：

+

 

+
XML.prototype.function::fooCount = function fooCount() {
+  return this..foo.length();
+};
+<foobar><foo/><foo/><foo/></foobar>.fooCount() // returns 3
+

 

+

ignoreComments

+

默认为 true。该属性告诉 E4X 在序列化和筛选时忽略注释节点。即当 ignoreComments 为 ture 时 .comments() 返回空。观察如下例子：

+

 

+
var element = <foo>
+                <!-- my comment -->
+                <bar/>
+              </foo>;
+element.comments().length(); // returns 0
+element.toXMLString(); // returns <foo><bar/></foo>
+XML.ignoreComments = false;
+element = <foo>
+            <!-- my comment -->
+            <bar/>
+          </foo>;
+element.comments().length(); // returns 1
+element.toXMLString(); // returns <foo><!-- my comment --><bar/></foo>
+

 

+

ignoreProcessingInstructions

+

默认为 ture。该属性告诉 E4X 在序列化和筛选时忽略 XML 中的处理指令。例如：

+

 

+
var element = <foo>
+                <?process x="true"?>
+                <bar/>
+                <?process x="false"?>
+              </foo>;
+element.toXMLString(); // returns <foo><bar/></foo>
+XML.ignoreProcessingInstructions = false;
+var element = <foo>
+                <?process x="true"?>
+                <bar/>
+                <?process x="false"?>
+              </foo>;
+element.toXMLString(); // returns <foo><?process x="true"?><bar/><?process x="false"?></foo>
+

 

+

ignoreWhitespace

+

默认为 true。忽略节点之间以及节点文本头尾两端的空白，而其他的则被解析为文本节点或作为文本节点的一部分。

+

prettyPrinting

+

默认是 true。为 true 时，toXMLString() 序列化 E4X 对象时会包含换行和缩进。

+

prettyIndent

+

默认值是 2。代表 XML 树每层缩进的空格数。如果 prettyPrinting 是 false 则忽略。

-- cgit v1.2.3-54-g00ecf