HTML - DOMTokenList remove() 方法

HTML DOMTokenList **remove()** 方法用於從 DOMTokenList 中移除引數中指定的一個或多個標記。

語法

domtokenlist.remove(token);

引數

此方法接受如下所示的單個引數。

引數	描述
token	它表示要從 DOMTokenList 中移除的標記的名稱。

返回值

此方法不返回任何值。

HTML DOMTokenList 'remove()' 方法示例

以下示例演示了 DOMTokenList remove() 方法的實現。

從元素中移除類

以下示例演示瞭如何使用 **remove()** 方法從任何元素中移除類。移除的類將移除元素的背景色和文字顏色。

<!DOCTYPE html>
<html lang="en">
<head>
    <title>HTML DOMTokenList remove() Method</title>
    <style>
        .color {
            background-color: #04af2f;
            color: white;
        }
        .font {
            font-size: 40px;
        }
    </style>
</head>
<body>
    <button onclick="fun()">Add</button>
    <button onclick="remove()">Remove</button>
    <p>Hii..</p>
    <p id="remove">Welcome to Tutorials Point...</p>
    <script>
        function fun() {
            let x = document.getElementById("remove").classList;
            x.add("color", "font");

        }
        function remove() {
            let x = document.getElementById("remove").classList;
            x.remove("color");
        }
    </script>
</body>
</html>

從元素中移除多個類

在以下示例中，我們從段落元素中移除多個類。

<!DOCTYPE html>
<html lang="en">
<head>
    <title>HTML DOMTokenList remove() Method</title>
    <style>
        .color {
            background-color: #04af2f;
            color: white;
        }
        .font {
            font-size: 40px;
        }
        .align {
            text-align: center;
        }
    </style>
</head>
<body>
    <button onclick="fun()">Add</button>
    <button onclick="remove()">Remove</button>
    <p>Hii..</p>
    <p id="remove">Welcome to Tutorials Point...</p>
    <script>
        function fun() {
            let x = document.getElementById("remove").classList;
            x.add("color", "font", "align");
        }
        function remove() {
            let x = document.getElementById("remove").classList;
            x.remove("color", "font");
        }
    </script>
</body>
</html>

使用條件語句移除類

在以下示例中，我們使用了條件語句，如果元素具有類 'font'，則移除類 'align'。

<!DOCTYPE html>
<html lang="en">
<head>
    <title>HTML DOMTokenList remove() Method</title>
    <style>
        .color {
            background-color: #04af2f;
            color: white;
        }
        .font {
            font-size: 40px;
        }
        .align {
            text-align: center;
        }
    </style>
</head>
<body>
    <button onclick="remove()">Remove</button>
    <p>Hii..</p>
    <p id="remove">Welcome to Tutorials Point...</p>
    <script>
        function remove() {
            let x = document.getElementById("remove").classList;
            x.add("color", "font", "align");
            if (x.contains("font")) {
                x.remove("align");
            }
        }
    </script>
</body>
</html>

支援的瀏覽器

方法
remove()	是 8	是 12	是 3.6	是 5.1	是 12.1

html_domtokenlist_reference.htm

列印頁面