HTML DOM - 元素-JavaScript中文网-JavaScript教程资源分享门户

在 HTML 文档中，每一个标签都是一个元素（element），元素可以包含文本、属性和其他元素。在 HTML DOM 中，每一个元素都是一个对象，我们可以通过 JavaScript 来操作这些元素对象。

获取元素

要操作一个元素，首先需要获取到这个元素。我们可以使用 document.getElementById() 方法来获取具有特定 id 的元素，也可以使用 document.getElementsByClassName() 方法来获取具有特定类名的元素，还可以使用 document.getElementsByTagName() 方法来获取具有特定标签名的元素。

示例代码：

--------- -----
------
------
    ---------------------
-------
------
    ---- --------------------------
    -- ----------------------------
    ----
        -------------
        -------------
    -----

    --------
        --- ---------- - ---------------------------------
        --- --------- - -------------------------------------------
        --- ---------- - ------------------------------------

        ------------------------
        -----------------------
        ------------------------
    ---------
-------
-------

操作元素

一旦获取到了元素，我们就可以对其进行操作。可以修改元素的文本内容、样式、属性等。常见的操作方法包括：

innerHTML：获取或设置元素的 HTML 内容
style：设置元素的样式
setAttribute()：设置元素的属性
appendChild()：向元素添加子元素
removeChild()：移除元素的子元素

示例代码：

--------- -----
------
------
    ---------------------
-------
------
    ---- --------------------------

    --------
        --- ---------- - ---------------------------------
        -------------------- - -----------
        ---------------------- - ------
        -------------------------------- ------------

        --- ---------- - ----------------------------
        --- -------- - --------------------------------------
        ---------------------------------
        -----------------------------------

        -----------------------------------
    ---------
-------
-------

通过以上示例，我们可以看到如何获取元素并对其进行操作。在实际开发中，我们常常需要通过 JavaScript 动态地修改页面中的元素，使页面具有更好的交互性和用户体验。