Javascript Innerhtml

Michael Zippo

您應該知道如何修改頁面上顯示的文本或 HTML，以使您的網站更具交互性。這就是 HTML innerText 和 innerHTML 屬性的用武之地。

這些屬性使修改 DOM 元素的文本及其 HTML 代碼變得容易.在本指南中，您將學習如何使用 innerText 和 innerHTML JavaScript 屬性。

什麼是 JavaScript innerHTML？

innerHTML JavaScript 屬性定義網頁上元素的 HTML 內容。 InnerHTML 是 HTML DOM 的一個屬性。 innerHTML 常用於定義和修改

元素的內容

你可以像這樣使用innerHTML：..

document.getElementById ("paragraph") innerHTML = " Karma career!”;

這行代碼定義了“Karma career”的“paragraph”

元素的內容！ getElementById () 方法通過其 ID 檢索元素。

瀏覽器設置一個 href = "/what-is-the-javascript-dom /" > 對像模型 (DOM) 文檔加載頁面時。此 DOM 是頁面上顯示的一系列對象。

DOM 意味著您不必每次更改 Web 元素時都更改 HTML 代碼。您可以使用 DOM 和 JavaScript 更改頁面在特定會話中的顯示方式

JavaScript innerT ext 屬性定義元素的文本內容。它還定義了其後代的內容。後代可以在段落中包含標籤

innerText的語法類似於innerHTML：..

document.getElementById("element") InnerText = "This is ”;

將 id 為“element”的元素的文本值設置為“這是一個測試”。

您可以通過轉到您的JavaScript 控制台並選擇要修改的元素：

這會更改網頁上第一個 HTML

標記的內容。如果要替換文字，可以使用innerText屬性：

修改頁面“這是一個測試。” "

讓我們從更改網頁上的文本開始。我們將創建一個帶有抽認卡的簡單網頁。該網頁將顯示一個關於 HTML 的問題。它會有一個按鈕，單擊該按鈕，將揭示一個 HTML 問題的答案。

我們的第一步是為我們的轉發創建一個 index.html 文件：

div>

這個頁面創建了一個包含三個組件的容器。首先，我們有我們問用戶的問題。我們有消息如何揭曉答案。我們的頁面以顯示響應的按鈕結束

我們的代碼返回元素的文本內容。