HTML - DOM 文件 links 屬性



HTML DOM document 的 **links** 屬性是一個只讀屬性,它返回所有對應於 **<a>** 和 **<area>** 元素(帶有 href 屬性)的連結集合。

語法

document.links;

屬性

屬性 描述
length 它返回 HTML 文件中存在的 <a> 和 <area> 元素的數量。

方法

下表顯示了 links 集合提供的方法列表。集合中的元素已排序,並按其在 HTML 文件中出現的順序呈現。

方法 描述
[index] 返回集合中給定索引處的元素。索引從 0 開始,如果索引超出範圍,則返回 null。
item(index) 返回集合中給定索引處的元素。索引從 0 開始,如果索引超出範圍,則返回 null。它與第一種方法類似。
namedItem(id) 返回集合中具有給定 id 的元素。如果 id 不存在,則返回 null。

返回值

它返回一個 HTMLCollection 物件,其中列出了文件中所有存在的 **<a>** 和 **<area>** 元素。

HTML DOM 文件 'links' 屬性示例

以下示例說明了 links 屬性和方法的使用。

獲取 <a> 和 <area> 元素的數量

在以下示例中,使用 **length** 屬性返回文件中 <a> 和 <area> 元素的數量。

<!DOCTYPE html>
<html lang="en">
<head>
    <title>
        HTML DOM document links Property
    </title>
</head>
<body>
    <a href="/index.htm">
        Welcome to Tutorials Point
    </a>
    <br><br>
    <area shape="rect" coords="" href="" alt="">
    <area shape="rect" coords="" href="" alt="">
    <a href=""></a>
    <button onclick="fun()">Click me</button>
    <p id="link"></p>
    <script>
        function fun() {
            let x = document.links.length;
            document.getElementById("link").innerHTML =x;
        }
    </script>
</body>
</html>

獲取第一個 <a> 或 <area> 元素的 URL

在此示例中,我們使用 images **[index]** 方法獲取第一個 <a> 或 <area> 元素的 URL。

<!DOCTYPE html>
<html lang="en">
<head>
    <title>
        HTML DOM document links Property
    </title>
</head>
<body>
    <a href="/index.htm">
        Welcome to Tutorials Point
    </a>
    <br><br>
    <area shape="rect" coords="" href="" alt="">
    <area shape="rect" coords="" href="" alt="">
    <a href=""></a>
    <button onclick="fun()">Click me</button>
    <p id="links"></p>
    <script>
        function fun() {
            let x = document.links[0];
            document.getElementById("links").innerHTML = x;
        }
    </script>
</body>
</html>

獲取 <a> 或 <area> 元素的 URL

在此示例中,我們使用 images **item(index)** 方法獲取第一個 <a> 或 <area> 元素的 URL。

<!DOCTYPE html>
<html lang="en">
<head>
    <title>
        HTML DOM document links Property
    </title>
</head>
<body>
    <a href="/index.htm">
        Welcome to Tutorials Point
    </a>
    <br><br>
    <area shape="rect" coords="" href="" alt="">
    <area shape="rect" coords="" href="" alt="">
    <a href=""></a>
    <button onclick="fun()">Click me</button>
    <p id="links"></p>
    <script>
        function fun() {
            let x = document.links.item(0);
            document.getElementById("links").innerHTML = x;
        }
    </script>
</body>
</html>

獲取具有指定 id 的 <a> 或 <area> 元素的 URL

以下示例返回具有指定 id 的 <a> 或 <area> 元素的 URL。

<!DOCTYPE html>
<html lang="en">
<head>
    <title>
        HTML DOM document links Property
    </title>
</head>
<body>
    <a href="/index.htm" id="link1">
        Welcome to Tutorials Point
    </a>
    <br><br>
    <area shape="rect" coords="" href="" alt="">
    <area shape="rect" coords="" href="" alt="">
    <a href=""></a>
    <button onclick="fun()">Click me</button>
    <p id="links"></p>
    <script>
        function fun() {
            let x = document.links.namedItem("link1");
            document.getElementById("links").innerHTML = x;
        }
    </script>
</body>
</html>

支援的瀏覽器

屬性 Chrome Edge Firefox Safari Opera
links 是 1 是 12 是 1 是 1 是 12.1
html_dom_document_reference.htm
廣告