XML Creating, Editing and Saving in JS

Question

I am trying to create something with heavy XML editing dependencies and I have a few questions about how I would go about doing certain things.

What I know:

HTML editing
XML method editing shares most methods with HTML (which is a type of XML itself)
How to load an XML document and navigate it

My questions:

how do you save an XML document that was edited in javascript or does it do it automatically
how do you create a blank XML file with javascript

score 2 · Accepted Answer · edited May 23 '17 at 12:34

Unfortunately you may not be able to do what you want. JavaScript/ECMAScript cannot write directly to a file without any direct interaction (at least, not to a file in the typical filesystem like a "My Documents" or "Desktop" folder).

First off, you can save an XML/HTML DOM to a string like this (will only work in later versions of most browsers and IE 9+):

if(typeof window.XMLSerializer == "undefined") {
    throw new Error("No modern XML serializer found.");
}
var s = new XMLSerializer();
var xmlString = s.serializeToString( xmlDomVar );

After that you only have 2 options as far as saving the data (without using some extra plugin and even those may have a number of restrictions):

Save the data to a sandboxed file that is only accessible to the application using localStorage after permission to use localStorage is given by the user (stored in a location determined by the browser, you can't define "C:\User\MyUser\Desktop\myfile.xml" as a location).
- Good guide here: http://www.noupe.com/design/html5-filesystem-api-create-files-store-locally-using-javascript-webkit.html
Save as Blob data then request that the user download it. This method will not let you define where you want the user to save it, it just presents the typical "Save File As..." dialog for the user to specify where to save the data.
- Good examples here: Is it possible to write data to file using only JavaScript?

For creating a "blank" xml file... you can't. It has to contain at least the opening and closing tags eitherwise the browser will return a basic-formatted HTML DOM complete with html, head, and body tags. Once again, will only work in IE9+ and most other modern browsers:

if (typeof window.DOMParser != "undefined") {
    parseXml = function(xmlStr) {
        return ( new window.DOMParser() ).parseFromString(xmlStr, "text/xml");
    };
} else {
    throw new Error("No modern XML parser found.");
}

// This will create a new XML DOM containing whatever is in the string.
var newXmlDom = parseXml( '<xml></xml>' );

// This will create a basic HTML structure if you do not provide any valid XML.
var newHtmlDom = parseXml();

XML Creating, Editing and Saving in JS

1 Answers1