# `Document.all`教程

> 原文： [http://zetcode.com/javascript/documentall/](http://zetcode.com/javascript/documentall/)

`Document.all`教程展示了如何使用`all`属性选择 JavaScript 中的所有 HTML 元素。

## `Document.all`

Document 的`all`属性返回一个以文档节点为根的`HTMLAllCollection`-它返回页面的全部内容。 该属性是只读的。

在我们的示例中，我们将使用 Ramda 库遍历返回的`HTMLAllCollection`。 有关更多信息，请参见 [Ramda 教程](/javascript/ramda/)。

## `Document.all`示例

下面的示例演示文档`all`属性的用法。

`index.html`

```js
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src="//cdnjs.cloudflare.com/ajax/libs/ramda/0.25.0/ramda.min.js"></script>
</head>

<body>

    <p>
        This is simple web document.
    </p>

    <script>

        let allTags = document.all;

        let nOfTags = R.length(R.keys(allTags));
        console.log(`There are ${nOfTags} tags in the document`);

        console.log('List of tags:');

        R.forEachObjIndexed((value, key) => {
            console.log(`${key}: ${value.localName}`);
        }, allTags);

    </script>
</body>

</html>

```

在文档中，我们显示元素的数量及其列表。

```js
<script src="//cdnjs.cloudflare.com/ajax/libs/ramda/0.25.0/ramda.min.js"></script>

```

我们包括 Ramda 库。

```js
let allTags = document.all;

```

使用`document.all`获取所有标签。

```js
let nOfTags = R.length(R.keys(allTags));
console.log(`There are ${nOfTags} tags in the document`);

```

我们计算标签的数量并将消息显示到控制台。

```js
R.forEachObjIndexed((value, key) => {
    console.log(`${key}: ${value.localName}`);
}, allTags);

```

使用 Ramda 的`forEachObjIndexed()`，我们遍历集合并输出所有标签名称。

在本教程中，我们使用了文档的`all`属性。

您可能也对以下相关教程感兴趣： [JavaScript `queryselector`教程](/javascript/queryselector/)， [`Element.innerHtml`教程](/dom/innerhtml/)， [JavaScript Lodash 教程](/javascript/lodash/)， [JQuery 教程](/web/jquery/) ， [Ramda 教程](/javascript/ramda/)或[使用 jQuery `DatePicker`](/articles/jquerydatepicker/)。