I want to add the declaration to an XML document generated in Javascript, but I did not find sufficient documentation.

Let's say I want to create programmatically (using Javascript) the following XML document:

<?xml version="1.0" encoding="UTF-8"?>
<people>
  <person first-name="eric" last-name="jung" />
</people>

Here is the code that I did:

let doc = document.implementation.createDocument("", "", null);
let peopleElem = doc.createElement("people");

let personElem = doc.createElement("person");
personElem.setAttribute("first-name", "eric");
personElem.setAttribute("last-name", "jung");

peopleElem.appendChild(personElem);
doc.appendChild(peopleElem);

let docStr = new XMLSerializer().serializeToString(doc.documentElement);
console.log(docStr);

// produces:
// <people>
//   <person first-name="eric" last-name="jung" />
// </people>

// and not:
// <?xml version="1.0" encoding="UTF-8"?>
// <people>
//   <person first-name="eric" last-name="jung" />
// </people>

How should I do to get the <?xml version="1.0" encoding="UTF-8"?> in the generated XML?

Note: I know that adding a declaration is useless in this case, but eventually I want to use a specific namespace and also add custom XML entities to my document.

Thank you for your help.

I want to add the declaration to an XML document generated in Javascript, but I did not find sufficient documentation.

Let's say I want to create programmatically (using Javascript) the following XML document:

<?xml version="1.0" encoding="UTF-8"?>
<people>
  <person first-name="eric" last-name="jung" />
</people>

Here is the code that I did:

let doc = document.implementation.createDocument("", "", null);
let peopleElem = doc.createElement("people");

let personElem = doc.createElement("person");
personElem.setAttribute("first-name", "eric");
personElem.setAttribute("last-name", "jung");

peopleElem.appendChild(personElem);
doc.appendChild(peopleElem);

let docStr = new XMLSerializer().serializeToString(doc.documentElement);
console.log(docStr);

// produces:
// <people>
//   <person first-name="eric" last-name="jung" />
// </people>

// and not:
// <?xml version="1.0" encoding="UTF-8"?>
// <people>
//   <person first-name="eric" last-name="jung" />
// </people>

How should I do to get the <?xml version="1.0" encoding="UTF-8"?> in the generated XML?

Note: I know that adding a declaration is useless in this case, but eventually I want to use a specific namespace and also add custom XML entities to my document.

Thank you for your help.

• javascript
• xml
• xml-declaration

• Don't you get an XML serialization with XMLSerializer if you serialize the whole doc node and not only its root element/documentElement node? I don't think the DOM API treats the XML declaration as a node, it is something to added during serialization but I am not sure the browser side APIs are very flexible in controlling this. – Martin Honnen Commented Aug 16, 2021 at 10:13
• 1 As for "custom" entities, the DOM API isn't very flexible and powerful for that either, but createDocument used to allow to pass in a DTD/doctype parameter. – Martin Honnen Commented Aug 16, 2021 at 10:14
• It seems even serializing the whole document doesn't output an XML declaration, mainly because serializeToString is not needing one. Not sure whether any more lower-level APIs to serialize to a stream or file exists where the ability to set/ensure a particular encoding would be needed. – Martin Honnen Commented Aug 16, 2021 at 10:20
• Would you suggest using a library such as this one to solve my problems? (adding declaration, adding custom entities, ...) – JacopoStanchi Commented Aug 16, 2021 at 10:22
• 1 That is a processing instruction the DOM (core/XML) API should support, unless the HTML5 guys/DOM4 guys have crippled browser APIs to no longer support them. – Martin Honnen Commented Aug 16, 2021 at 10:34

1 Answer 1

Here is one way to do it.

See the list of patible node types for XMLSerializer.

There is ProcessingInstruction node that can be created with createProcessingInstruction method.

Finally, you need to serialize the whole document, not only the documentElement.

const doc = document.implementation.createDocument("", "", null);
const peopleElem = doc.createElement("people");

const pi = doc.createProcessingInstruction('xml', 'version="1.0" encoding="UTF-8"');
doc.insertBefore(pi, doc.firstChild);

const personElem = doc.createElement("person");

personElem.setAttribute("first-name", "eric");
personElem.setAttribute("last-name", "jung");

peopleElem.appendChild(personElem);

doc.appendChild(peopleElem);

const docStr = new XMLSerializer().serializeToString(doc);

console.log(docStr);