JavaScript 如何動態隱藏和顯示 HTML 元素？

使用 JavaScript 動態隱藏元素

假設您有一個允許使用者編輯文字元素的按鈕。單擊按鈕後，您可能希望按鈕消失，並將文字元素替換為文字區域以進行編輯。以下是使用JavaScript 實現此目的的方法：

function showStuff(id, text, btn) {
    // Display the element with the given ID
    document.getElementById(id).style.display = 'block';

    // Hide the lorem ipsum text
    document.getElementById(text).style.display = 'none';

    // Hide the link
    btn.style.display = 'none';
}

在提供的HTML 程式碼片段中，您可以按以下方式修改它：

<td class="post">

    <a href="#" onclick="showStuff('answer1', 'text1', this); return false;">Edit</a>
    <span>

點擊「編輯」連結時，發生以下操作：

• 包含文字區域的隱藏「answer1」範圍變為可見。
• 包含 lorem ipsum 文字的「text1」範圍被隱藏。
• 「編輯」連結本身變得不可見。

以上是JavaScript 如何動態隱藏和顯示 HTML 元素？的詳細內容。更多資訊請關注PHP中文網其他相關文章！