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