The createProcessingInstruction() method of the Document interface creates a new ProcessingInstruction object and returns it.
createProcessingInstruction(target, data)targetA string containing the first part of the processing instruction (i.e., <?target … ?>)
dataA string containing any information the processing instruction should carry, after the target. The data can contain any character pattern, except that it can't contain ?>, since that closes the processing instruction.
ProcessingInstruction node.InvalidCharacterError DOMExceptionThrown if either of the following are true:
The createProcessingInstruction() method creates a new processing instruction. The new node will usually be inserted into a document to accomplish a task with it, using a method such as node.insertBefore.
Initially, ProcessingInstruction nodes were only supported in XML documents, not in HTML documents. In non-supporting browsers, a processing instruction will be interpreted as a comment and represented as a Comment object in the DOM tree.
This example creates an <xml-stylesheet> processing instruction and adds it to the top of an example XML document.
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/>