HTML DOM 元素的 innerHTML
示例
獲取 id="myP" 的元素的 HTML 內容
let html = document.getElementById("myP").innerHTML;
自己動手試一試 »
更改 id="demo" 的元素的 HTML 內容
document.getElementById("demo").innerHTML = "我已更改！";
自己動手試一試 »
獲取 id="myList" 的 <ul> 元素的 HTML 內容
let html = document.getElementById("myList").innerHTML;
自己動手試一試 »
刪除 id="demo" 的 <p> 元素的 HTML 內容
element.innerHTML = "";
自己動手試一試 »
更多示例見下文。
描述
innerHTML 屬性設定或返回元素的 HTML 內容（內部 HTML）。
innerHTML、innerText 和 textContent 之間的差異
innerHTML、innerText 和 textContent
請參閱下方
語法
返回 innerHTML 屬性
元素.innerHTML
設定 innerHTML 屬性
元素.innerHTML = 文字
屬性值
| 屬性 | 描述 |
| 字串 | HTML 內容。 |
返回值
| 型別 | 描述 |
| 字串 | 元素的 HTML 內容。 |
更多示例
示例
更改兩個元素的 HTML 內容
let text = "你好 Dolly。";
document.getElementById("myP").innerHTML = text;
document.getElementById("myDIV").innerHTML = text;
自己動手試一試 »
示例
更改連結的 HTML 內容和 URL
element.innerHTML = "W3Schools";
element.href = "https://w3schools.tw";
自己動手試一試 »
innerHTML、innerText 和 textContent 之間的差異
innerHTML、innerText 和 textContent
| innerHTML 屬性返回 元素的文字內容，包括所有空格和內部 HTML 標籤。 |
| innerText 屬性返回 僅元素的文字內容及其所有子元素，不包括 CSS 隱藏的文字、空格和標籤，除了 <script> 和 <style> 元素。 |
| textContent 屬性返回 元素及其所有後代元素的文字內容，包括空格和 CSS 隱藏的文字，但不包括標籤。 |
HTML 示例
<p id="myP"> 此元素有額外的空格 幷包含 <span>一個 span 元素</span>。</p>
JavaScript 示例
let text = document.getElementById("myP").innerText;
let text = document.getElementById("myP").innerHTML;
let text = document.getElementById("demo").textContent;
自己動手試一試 »
在上面的例子中
| innerText 屬性返回 此元素有額外的空格幷包含一個 span 元素。 |
| innerHTML 屬性返回 此元素有額外的空格 幷包含 <span>一個 span 元素</span>。 |
| textContent 屬性返回 此元素有額外的空格 幷包含一個 span 元素。 |
瀏覽器支援
element.innerHTML 在所有瀏覽器中都受支援
| Chrome | Edge | Firefox | Safari | Opera | IE |
| 是 | 是 | 是 | 是 | 是 | 是 |
