Browse DevX
Sign up for e-mail newsletters from DevX


Mozilla's Potpourri of Rendered XML  : Page 3

Mozilla 1.0 is busting out and it can display a lot more than just text, links, and images. Check out the interaction of display standards at work in this new browser.




Building the Right Environment to Support AI, Machine Learning and Deep Learning

Common Services Provided by the Browser
Mozilla's support for certain renderable DTDs goes further than just painting the right thing in the right spot; it can also coordinate across DTDs. This snippet from example2.xml shows styles applied both generally and specifically:

<html:style> * { color:darkgreen; } body { background-color:lightyellow; font-size: 10pt;} math { background-color:lightblue; font-size: 20pt;} svg { fill-opacity:0.5; stroke:currentColor; stroke-width:0.1cm; } svg circle { fill:red; } svg polygon { fill:green; } svg rect { fill:blue; } </html:style>

Even though the code is an HTML <html:style> tag, the styles apply across the whole document. The first style rule sets all foreground color to dark green. Both HTML and MathML characters are now green. Note that SVG support lags a bit here, but at least the shape borders have changed somehow from the first example. You can also use styles specific to one language; for example, "fill" is an SVG-only style. But be careful, you should not apply all styles to all types of markup. In particular, MathML is fussy about what you should and shouldn't do with styles.

Example 2 also contains a bit of JavaScript (remember that since IE is incapable of displaying the examples, Example 2 will show either an error or XML source code when viewed in IE). Because Mozilla supports the DOM1 standard for XML and also supports JavaScript binding to DOM1, all the page's markup is exposed to scripting. The screenshot in Figure 2 shows the elements that the function walk() discovers when it inspects the document tree.

Figure 2. Elements discovered by the walk() function as it inspects the document tree.
Mozilla also has script support beyond DOM1—you can script events and styles. So it's possible to use DHTML to control both HTML and SVG content. You can also write "DMathML" code, but finding a practical use is harder. From JavaScript you can add, subtract, move, modify and trigger events for all content, regardless of its origin.

The standard way to access an XML element from script is to use the getElementById() object method, but there's a standards trap here. ID is a concept, not a name. HTML implements the ID concept through the "ID" attribute, but in other markup languages, a different attribute might stand for ID, such as "ROWID" or "OBJECTID". Before you rush forward, read the standards to find out what each uses for the ID concept in each case. You'll probably find that most use an "ID" attribute, as you'd expect, but check first.

Comment and Contribute






(Maximum characters: 1200). You have 1200 characters left.



Thanks for your registration, follow us on our social networks to keep up-to-date