Document: createProcessingInstruction() method

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.

createProcessingInstruction() generates a new processing instruction node and returns it.

The new node usually will be inserted into an XML document in order to accomplish anything with it, such as with node.insertBefore.

Syntax

js
createProcessingInstruction(target, data)

Parameters

piNode

The resulting ProcessingInstruction node.

target

A string containing the first part of the processing instruction (i.e., <?target … ?>)

data

A string containing any information the processing instruction should carry, after the target. The data is up to you, but it can't contain ?>, since that closes the processing instruction.

Return value

None (undefined).

Exceptions

InvalidCharacterError DOMException

Thrown if either of the following are true:

  • The target value is not a valid XML name; for example, it starts with a number, hyphen, or period, or contains characters other than alphanumeric characters, underscores, hyphens, or periods.
  • The closing processing instruction sequence (?>) is part of the data value.

Examples

js
const doc = new DOMParser().parseFromString("<foo />", "application/xml");
const pi = doc.createProcessingInstruction(
  "xml-stylesheet",
  'href="mycss.css"',
);

doc.insertBefore(pi, doc.firstChild);

console.log(new XMLSerializer().serializeToString(doc));
// Displays: <?xml-stylesheet href="mycss.css" type="text/css"?><foo/>

Specifications

Specification
DOM
# ref-for-dom-document-createprocessinginstruction①

Browser compatibility

Report problems with this compatibility data on GitHub
desktopmobile
Chrome
Edge
Firefox
Opera
Safari
Chrome Android
Firefox for Android
Opera Android
Safari on iOS
Samsung Internet
WebView Android
WebView on iOS
createProcessingInstruction

Legend

Tip: you can click/tap on a cell for more information.

Full support
Full support