Xml
Step three: Create the corresponding HTML file.
1. Import XML data.
We know that in the current popular browsers, only Microsoft's IE5.0 version of the browser supports XML for the time being. IE supports inserting XML by object object in HTML, and imports data through the XmlDocument.Load () method of JS. We look at the code: <object width= "0" height= "0"
Classid= "clsid:550dda30-0541-11d2-9ca9-0060b0ec3d39" id= "Xmldso" >
</object>
Defines a object,id named Xmldso. Then use JS in the head area to introduce XML data:
<script for= "window" event= "onload" >
Xmldso. XmlDocument.Load ("Cd.xml");
</script>
2. Bundle of data.
The XML data is then bound to the table using the <SPAN> identity. Where id,datasrc,dtatfld are the properties of <SPAN>. The code is as follows:
<table>
<tr><td>title:</td><td><span id= "title" datasrc= #xmldso datafld= "title" ></span ></td></tr>
<tr><td>artist:</td><td><span id= "Artist" datasrc= #xmldso datafld= "Artist" ></ Span></td></tr>
<tr><td>year:</td><td><span id= "Year" datasrc= #xmldso datafld= "year" ></SPAN> </td></tr>
<tr><td>country:</td><td><span id= "Country" datasrc= #xmldso datafld= "Country" ></ Span></td></tr>
<tr><td>company:</td><td><span id= "Company" Datasrc= #xmldso datafld= "Company" ></ Span></td></tr>
<tr><td>price:</td><td><span id= "Price" datasrc= #xmldso datafld= ' price ' ></span ></td></tr>
</table>
3. Action operation.
Finally, provide the browse button for the data:
<input Type=button value= "Previous CD" >
<input Type=button value= "Next CD" >
and use JS to complete the two mouse clicks: MoveNext () and MovePrevious (). Add the following code to the head area:
<script language= "JavaScript" >
function MoveNext ()
{
if (Xmldso.recordset.absoluteposition < Xmldso.recordset.recordcount)
{
Xmldso.recordset.movenext ();
}
}
function MovePrevious ()
{
if (Xmldso.recordset.absoluteposition > 1)
{
Xmldso.recordset.moveprevious ();
}
}
</script>
OK, let's look at all the original code for the HTML file:
<script for= "window" event= "onload" >
Xmldso. XmlDocument.Load ("Cd.xml");
</script>
<script language= "JavaScript" >
function MoveNext ()
{
if (Xmldso.recordset.absoluteposition < Xmldso.recordset.recordcount)
{
Xmldso.recordset.movenext ();
}
}
function MovePrevious ()
{
if (Xmldso.recordset.absoluteposition > 1)
{
Xmldso.recordset.moveprevious ();
}
}
</script>
<TITLE>CD navigate</title>
<body>
<p>
<object width= "0" height= "0"
Classid= "clsid:550dda30-0541-11d2-9ca9-0060b0ec3d39" id= "Xmldso" >
</object>
<table>
<tr><td>title:</td><td><span id= "title" datasrc= #xmldso datafld= "title" ></span ></td></tr>
<tr><td>artist:</td><td><span id= "Artist" datasrc= #xmldso datafld= "Artist" ></ Span></td></tr>
<tr><td>year:</td><td><span id= "Year" datasrc= #xmldso datafld= "year" ></SPAN> </td></tr>
<tr><td>country:</td><td><span id= "Country" datasrc= #xmldso datafld= "Country" ></ Span></td></tr>
<tr><td>company:</td><td><span id= "Company" Datasrc= #xmldso datafld= "Company" ></ Span></td></tr>
<tr><td>price:</td><td><span id= "Price" datasrc= #xmldso datafld= ' price ' ></span ></td></tr>
</table>
<p>
<input Type=button value= "Previous CD" >
<input Type=button value= "Next CD" >
</p>
</body>
Save the above code as a cd.htm file and put it together in the second step of the Cd.xml file. Open the Cd.htm file and you'll see the same effect as the example above.
