Document: anchors property

Deprecated: This feature is no longer recommended. Though some browsers might still support it, it may have already been removed from the relevant web standards, may be in the process of being dropped, or may only be kept for compatibility purposes. Avoid using it, and update existing code if possible; see the compatibility table at the bottom of this page to guide your decision. Be aware that this feature may cease to work at any time.

The anchors read-only property of the Document interface returns a list of all of the anchors in the document.

Value

Examples

Basic usage

js
if (document.anchors.length >= 5) {
  console.log("found too many anchors");
}

Creating a table of contents

The following is an example that auto populates a Table of Contents with every anchor on the page:

html

Title

Contents

    Plants

    1. Apples
    2. Oranges
    3. Pears

    Veggies

    1. Carrots
    2. Celery
    3. Beats
    js
    const toc = document.getElementById("toc");
    for (const anchor of document.anchors) {
      const li = document.createElement("li");
      const newAnchor = document.createElement("a");
      newAnchor.href = `#${anchor.name}`;
      newAnchor.textContent = anchor.text;
      li.appendChild(newAnchor);
      toc.appendChild(li);
    }
    

    Notes

    For reasons of backwards compatibility, the returned set of anchors only contains those anchors created with the name attribute, not those created with the id attribute.

    Specifications

    Specification
    HTML
    # dom-document-anchors

    Browser compatibility