Detailed explanation of the differences between innerHTML attributes, outerHTML attributes, textContent attributes, and innerText attributes_javascript skills

The innerHTML attribute is used to read or set the HTML code within a node.

When the outerHTML attribute is used to read or set HTML code, the node itself will be included.

The textContent attribute is used to read or set the text content contained in the node.

The innerText attribute and the outerText attribute get different values ​​when reading the text content of the element node. The difference between them is that when setting the text attribute of a node, the outerText attribute will cause the original element node to be replaced by the text node. Note that innerText is a non-standard property and is not supported by Firefox.

1.innerText is affected by CSS, textcontent does not have this problem. For example, if a CSS rule hides a certain text, innerText will not return this text, but textcontent will still be returned.

2. The text returned by innerText will filter out spaces, line feeds and enter keys, but textcontent will not

3. The innerText attribute is not part of the DOM standard. Firefox browser does not even deploy this attribute, while textcontent is part of the DOM standard.

The above is the entire content of this article. I hope it will be helpful for everyone to learn and become familiar with javascript.