Search code examples
javascriptxmlfirefox-addonjscript

Create XML with element and attribute in Firefox add-on

I am trying to build some XML using JavaScript in a Firefox add-on and facing issues.

Below is the XML format I am looking for:

<testing>
    <testingOne attr="my_attrib">
        <TestingTwo>abc</TestingTwo >
        <TestingThree>bbc</TestingThree>
    </testingOne >
</testing>

I tried using the code below. But, it is not working.

var XML = document.createElement("div");
var Node = document.createElement("testing");
Node.appendChild( document.createElement("testingOne") );
var a = document.createAttribute("my_attrib");

node.setAttributeNode(a);

Node.appendChild( document.createElement("TestingTwo") );
Node.appendChild( document.createElement("TestingThree") );
XML.appendChild(Node);

alert(XML.innerHTML);

How can I create XML just like the above example using JavaScript in a Firefox add-on?

Solution

  • You are wanting to create an XML DOM tree using JavaScript in a Firefox Add-on. Doing so in a Firefox add-on is somewhat more complex than form JavaScript that is run in a webpage. The reason for this is that the window and document variables are not guaranteed to be set. Even if they are set, they are probably not set to what you expect them to be. Firefox add-ons deal with multiple windows and multiple documents. Thus, if you use the window and document variables, you should always make sure they are set to what you intended them to be.

    In this instance, we just find the primary <window> element of the most recently used Firefox window and the <document> element associated with the tab it is currently displaying.

    The following code which will produce the XML you desire:

    function createDesiredXMLElements() {
    //To create elements, we need a <document>. To find a <document> we need a <window>.
    //This gets the currently active Firefox XUL window.
    //  Add/remove a "/" to comment/un-comment the code appropriate for your add-on type.
    //* Add-on SDK:
    let activeWindow = require('sdk/window/utils').getMostRecentBrowserWindow();
    //*/
    /* Overlay and bootstrap (from almost any context/scope):
    Components.utils.import("resource://gre/modules/Services.jsm");//Services
    let activeWindow=Services.wm.getMostRecentWindow("navigator:browser");        
    //*/
    //Get the HTML document for the currently displayed tab in the current Firefox window.
    let contentDoc = activeWindow.content.document;
    //To create XML elements, we need an XML document. We could do it without creating
    //  an XML document. But, then we would need to use createElementNS() to specify
    //  the XML namespace for each element. This way, they inherit the xmlDoc's namespace.
    let xmlNS = "http://www.w3.org/XML/1998/namespace";
    let xmlDoc = contentDoc.implementation.createDocument(xmlNS,"document");

    //Create the XML elements/nodes/attribute and add text.
    let testing = xmlDoc.createElement("testing");
    let testingOne = xmlDoc.createElement("testingOne");
    testingOne.setAttribute("attr","my_attrib");
    let testingTwo = xmlDoc.createElement("TestingTwo");
    testingTwo.textContent = "abc";
    let testingThree = xmlDoc.createElement("TestingThree");
    testingThree.textContent = "bbc";
    //Place the elements as children of each appropriate node.
    testing.appendChild(testingOne);
    testingOne.appendChild(testingTwo);
    testingOne.appendChild(testingThree);
    //Show the alert. Note that the alert function is a method of a <window>:
    activeWindow.alert(testing.outerHTML);
}

    The alert produced by this code looks like:
    Alert of desired XML