What exactly can cause an "HIERARCHY_REQUEST_ERR: DOM Exception 3"-Error?

domexception, javascript, jquery

Solution

It means you've tried to insert a DOM node into a place in the DOM tree where it cannot go. The most common place I see this is on Safari which doesn't allow the following:

document.appendChild(document.createElement('div'));

Generally, this is just a mistake where this was actually intended:

document.body.appendChild(document.createElement('div'));

Other causes seen in the wild (summarized from comments):

- You are attempting to append a node to itself

- You are attempting to append null to a node

- You are attempting to append a node to a text node.

- Your HTML is invalid (e.g. failing to close your target node)

- The browser thinks the HTML you are attempting to append is XML (fix by adding `<!doctype html>` to your injected HTML, or specifying the content type when fetching via XHR)

Problem

How exactly does it relate to jQuery? I know the library uses native javascript functions internally, but what exactly is it trying to do whenever such a problem appears?

Original source

Related problems