溫馨提示×

js中textContent、innerText和innerHTML怎么用

js
小億
181
2024-02-20 18:14:23
欄目: 編程語言

textContent、innerText和innerHTML都是用來訪問和設(shè)置元素內(nèi)容的屬性。

  1. textContent：textConent返回元素的所有文本內(nèi)容，包括子元素中的文本?？梢杂脕慝@取或設(shè)置一個(gè)元素的文本內(nèi)容。

例子：

let element = document.getElementById("example");
console.log(element.textContent); // 獲取元素的文本內(nèi)容
element.textContent = "這是新的文本內(nèi)容"; // 設(shè)置元素的文本內(nèi)容
  1. innerText：innerText返回元素的可見文本內(nèi)容，不包括隱藏的元素和樣式的文本。可以用來獲取或設(shè)置一個(gè)元素的可見文本內(nèi)容。

例子：

let element = document.getElementById("example");
console.log(element.innerText); // 獲取元素的可見文本內(nèi)容
element.innerText = "這是新的可見文本內(nèi)容"; // 設(shè)置元素的可見文本內(nèi)容
  1. innerHTML：innerHTML返回元素的所有HTML內(nèi)容，包括標(biāo)簽和文本。可以用來獲取或設(shè)置一個(gè)元素的HTML內(nèi)容。

例子：

let element = document.getElementById("example");
console.log(element.innerHTML); // 獲取元素的HTML內(nèi)容
element.innerHTML = "<p>這是新的HTML內(nèi)容</p>"; // 設(shè)置元素的HTML內(nèi)容

總結(jié)：textContent用于獲取和設(shè)置元素的文本內(nèi)容，innerText用于獲取和設(shè)置元素的可見文本內(nèi)容，innerHTML用于獲取和設(shè)置元素的HTML內(nèi)容。根據(jù)需要選擇合適的屬性來操作元素內(nèi)容。

0 踩