Skip to content
← Back to rules

unicorn/prefer-dom-node-text-content Style

🛠️ An auto-fix is available for this rule for some violations.

What it does ​

Enforces the use of .textContent over .innerText for DOM nodes.

Why is this bad? ​

There are some disadvantages of using .innerText.

  • .innerText returns rendered text and ignores hidden content, while .textContent returns the node's full text content.
  • .innerText can trigger reflow because it takes CSS styles into account.
  • .innerText is defined only for HTMLElement objects, while .textContent is defined for all Node objects.

Examples ​

Examples of incorrect code for this rule:

javascript
const text = foo.innerText;

Examples of correct code for this rule:

javascript
const text = foo.textContent;

How to use ​

To enable this rule using the config file or in the CLI, you can use:

json
{
  "rules": {
    "unicorn/prefer-dom-node-text-content": "error"
  }
}
ts
import { defineConfig } from "oxlint";

export default defineConfig({
  rules: {
    "unicorn/prefer-dom-node-text-content": "error",
  },
});
bash
oxlint --deny unicorn/prefer-dom-node-text-content

Version ​

This rule was added in v0.0.21.

References ​