# unicorn/prefer-dom-node-append

> Require `.append()` instead of `.appendChild()` on DOM nodes

`appendChild()` takes exactly one node. `append()` takes any number of nodes, and strings too, so you don't need `document.createTextNode()` or one call per child.

The rule doesn't know types. It reports every call to a method named `appendChild` with one argument.

`--fix` renames the method if the call is a statement of its own and the file shows that the object is a DOM node: `document.body`, `document.createElement()`, `document.querySelector()` and the like, or a variable that's declared with one of these and never assigned again. `--fix-dangerously` renames the others.

{/* Generated by src/codegen/lint-rule-docs.ts. Do not edit this section. */}

## Configure

Off by default. To turn it on:

```toml bunfig.toml
[lint.rules]
"unicorn/prefer-dom-node-append" = "error" # or "warn"
```

{/* End of the generated section. */}

## Examples

Reported:

{/* bad */}
```js
const item = document.createElement("li");
list.appendChild(item);
```

Not reported:

{/* good */}
```js
const item = document.createElement("li");
list.append(item);
list.append("Total: ", count, footer);
```

## When not to use it

`appendChild()` returns the node it added and `append()` returns `undefined`. The rule doesn't check whether you use the result. `const item = list.appendChild(node)` is reported like any other call, and after `--fix-dangerously` `item` is `undefined`. If your code relies on the returned node, leave the rule off.