ZetCode

Document.all tutorial

last modified last modified April 30, 2025

In this article we show how to use the all property to select all HTML elements in JavaScript.

Document.all

The all property of the Document object returns an HTMLAllCollection, representing all the elements within the document. It provides access to the entire contents of the page as a read-only collection. While this property can be useful for querying document nodes, it is considered outdated and should be used with caution, as modern best practices recommend other DOM methods like querySelector or getElementById for element selection.

In our example we are going to traverse the returned HTMLAllCollection with Ramda library. See Ramda tutorial for more information.

Document.all example

The following example demonstrates the usage of the document's all property.

index.html
<!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>

In the document, we display the number of the elements and their list.

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

We include the Ramda library.

let allTags = document.all;

The get all tags with document.all.

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

We compute the number of tags and show the message to the console.

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

With Ramda's forEachObjIndexed we go through the collection and output all tag names.

Source

Document: all property

In this article we have worked with the document's all property.

Author

My name is Jan Bodnar, and I am a passionate programmer with extensive programming experience. I have been writing programming articles since 2007. To date, I have authored over 1,400 articles and 8 e-books. I possess more than ten years of experience in teaching programming.

List all JavaScript tutorials.