Latest web development tutorials

XML Considerations

Here is a list that you should try to avoid using when using XML technology.


Internet Explorer - XML ​​data island

What is it?XML data island embedded into HTML pages XML data.

Why should you avoid it?XML data island is only valid in the Internet Explorer browser.

What replaced it?You should use HTML, JavaScript and XML DOM to parse and display XML.

For more information on JavaScript and XML DOM, visit our XML DOM tutorial .


XML data island instances

This example uses XML documents " cd_catalog.xml ."

The XML document is bound to the HTML document in a <xml> tag. id attribute defines an identifier of the data island, and the src attribute to an XML file:

Examples

This example applies only to IE browser

<html>
<body>

<xml id="cdcat" src="cd_catalog.xml"></xml>

<table border="1" datasrc="#cdcat">
<tr>
<td><span datafld="ARTIST"></span></td>
<td><span datafld="TITLE"></span></td>
</tr>
</table>

</body>
</html>

try it"

datasrc attribute <table> tag of the HTML table bound to the XML data island.

<Span> tag allows datafld attribute references the XML element to be displayed. In this example, to refer to the "ARTIST" and "TITLE". When reading XML, creates a corresponding table row for each <CD> element.


Internet Explorer - Behavior

What is it?Internet Explorer 5 introduced behavior. Behavior is a way to add behavior by using CSS styles to XML (or HTML) elements.

Why should you avoid it?Only Internet Explorer supports behavior properties.

What replaced it?Using JavaScript and XML DOM (or HTML DOM) to replace it.

Example 1 - Mouse hover highlight

The following HTML file <style> element for the <h1> element defines a behavior:

<html>
<head>
<style type="text/css">
h1 { behavior: url(behave.htc) }
</style>
</head>
<body>

<h1>Mouse over me!!!</h1>

</body>
</html>

Shown below is an XML document "behave.htc" (This file contains some JavaScript and event handlers for the element):

<attach for="element" event="onmouseover" handler="hig_lite" />
<attach for="element" event="onmouseout" handler="low_lite" />

<script>
function hig_lite()
{
element.style.color='red';
}

function low_lite()
{
element.style.color='blue';
}
</script>

try it"

Example 2 - Typewriter Simulation

The following HTML file <style> element id defines the action for "typing" of elements:

<html>
<head>
<style type="text/css">
#typing
{
behavior:url(typing.htc);
font-family:'courier new';
}
</style>
</head>
<body>

<span id="typing" speed="100">IE5 introduced DHTML behaviors.
Behaviors are a way to add DHTML functionality to HTML elements
with the ease of CSS.<br /><br />How do behaviors work?<br />
By using XML we can link behaviors to any element in a web page
and manipulate that element.</p>v </span>

</body>
</html>

Shown below is an XML document "typing.htc":

<attach for="window" event="onload" handler="beginTyping" />
<method name="type" />

<script>
var i,text1,text2,textLength,t;

function beginTyping()
{
i=0;
text1=element.innerText;
textLength=text1.length;
element.innerText="";
text2="";
t=window.setInterval(element.id+".type()",speed);
}

function type()
{
text2=text2+text1.substring(i,i+1);
element.innerText=text2;
i=i+1;
if (i==textLength)
{
clearInterval(t);
}
}
</script>

try it"