---
description: 🚧 under construction
---

# element content

[browser](../../..) ⟩ [DOM](../..) ⟩ [type](..) ⟩ [Element]() ⟩ content

{% hint style="success" %}

{% endhint %}

{% tabs %}
{% tab title="⭐️ 重點" %}
{% hint style="danger" %}
When [`nodeValue`](https://developer.mozilla.org/en-US/docs/Web/API/Node/nodeValue) is defined to be <mark style="color:orange;">**`null`**</mark>, setting it <mark style="color:red;">**has no effect**</mark>.
{% endhint %}
{% endtab %}

{% tab title="📘 手冊" %}
* Node ⟩
  * [.textContent](https://developer.mozilla.org/en-US/docs/Web/API/Node/textContent) - text content of the <mark style="color:yellow;">**node**</mark> and its <mark style="color:orange;">**descendants**</mark>.
  * [.nodeValue](https://developer.mozilla.org/en-US/docs/Web/API/Node/nodeValue) - returns/sets the <mark style="color:yellow;">**value**</mark> of the node.
* Element ⟩&#x20;
  * [.innerHTML](https://developer.mozilla.org/en-US/docs/Web/API/Element/innerHTML) - replace the <mark style="color:yellow;">**content**</mark> of the element.
  * [.outerHTML](https://developer.mozilla.org/en-US/docs/Web/API/Element/outerHTML) - replace the element <mark style="color:red;">**itself**</mark>.
  * [.insertAdjacentHTML()](https://developer.mozilla.org/en-US/docs/Web/API/Element/insertAdjacentHTML) -  👉 🗺️ 圖解
{% endtab %}

{% tab title="🗣 討論" %}
* [nodeValue vs innerHTML and textContent. How to choose?](https://stackoverflow.com/questions/21311299/nodevalue-vs-innerhtml-and-textcontent-how-to-choose)
{% endtab %}
{% endtabs %}
