IE XML Data Island Functionality in NS6+ Browsers | 2 | WebReference

IE XML Data Island Functionality in NS6+ Browsers | 2

IE XML Data Island Functionality in NS6+ Browsers

Netscape 6+ browsers don't allow the creation of a data island with an <xml> element, but they don't have any difficulties embedding XML data and using DOM to access child elements. This workaround is great with the files I've tested (however, I've never tested it with files larger than a couple hundred kbs). Depending on the power of your browser, you might be able to use larger file sizes.

How Does it Work?

All you need to do is embed your XML file just as you would embed style sheet files or JavaScript in your pages. You can access an element using DOM methods by getting an element's name, tag name or its id. The same logic works here. For the sake of this example, we'll use an ID attribute for our element. Here, we'll create
an xml element and assign it an ID as below:

      <xml id="xmlDoc">
      rest of the xml contents here
      </xml>

We might not want our HTML page to show the XML contents, so we'll use style sheets with elements display=none;. Now, when we open the browser, all of the content is there, but hidden. From this point, there's not much to it. In earlier pages you've seen the JavaScript in the IE Specific approach. Here, we'll use the same script with few changes. To create an XMLDocument object we used(for IE specific approach): 
      var xmlDoc = document. all("testXML").XMLDocument;
In this work around, we'll use use document.getElementById ("xmlDoc") to get reference to that element, which creates a data island. Looking at this part of the code, you'll see only a couple of differences, such as this line document.getElementById ("xmlDoc") and this var parentNode = getNoneTextNode(xmlDoc); line 
      var xmlDoc = document.getElementById("xmlIsland");
      
      Where as in the IE specific approach instead of the above line we had
      
      var xmlDoc = document. all("xmlIsland").XMLDocument;
As for the second difference, that's used to make sure that we have the correct parent element.
      
      var parentNode = getNoneTextNode(xmlDoc);
In the code above we've ensured that we have the correct parent element, In IE specific example, we pointed to the second element of the root element as below: 
      parseXML(xmlDoc.childNodes[1]);
And that's about it. You can see that it's pretty straightforward to embed an XML document in Netscape 6+ browsers. However, you'll need to check the standard compliance of different browsers, which can change drastically from version to version, as happened in the IE's Version 6 browsers.

Below is a working example, Click on the button to see the results in the left pane:


        <xml id="xmlIsland" style="visibility:hidden;">
          <employees>
           <employee>
          		<name>Name</name>
          		<job>Job</job>
          		<department>Department</department>
          		<cubicle>Cubicle</cubicle>
          	</employee>
          
          	<employee>
          		<name>Joe</name>
          		<job>Programmer</job>
          		<department>Engineering</department>
          		<cubicle>5E</cubicle>
          	</employee>
            
              <employee>
          		<name>Jane</name>
          		<job>Desigmer</job>
          		<department>Architecture</department>
          		<cubicle>12A</cubicle>
          	</employee>
          </employees>
        </xml>

Khalid Ali is a Freelance Developer who works out of Calgary, Alberta, in Canada. Over several years, he has participated in projects involving various programming languages, including VB, C/C++ and Java. His web related experience includes projects using Java servlets/jsp XML/XSL and Javascript/DHTML/XSS/HTML. Khalid can be reached at via email [email protected]

Created: June 2, 2003
Revised: June 2, 2003

URL: https://webreference.com/programming/javascript/xml