w3pop.com :: ÍøÂçѧԺ :: XML :: XML Ó¦ÓóÌÐò
This chapter demonstrates a small framework for an XML application.
±¾Õ½«½éÉÜÈçºÎΪXMLÓ¦ÓóÌÐòÊéдһ¸öС¿ò¼Ü¡£
Note: This example uses a Data Island, which only works in Internet Explorer.
×¢Ò⣺Õâ¸ö°¸ÀýʹÓÃÁËÊý¾Ýµº£¬Ëü½öÔÚIEÖÐʹÓá£
Look at the following XML document ("cd_catalog.xml"), that represents a CD catalog:
Çë¿´ÏÂÃæµÄXMLÎĵµ("cd_catalog.xml")£¬ËüÁоÙÁËÒ»·ÝCDĿ¼£º
<?xml version="1.0" encoding="ISO-8859-1"?> |
View the full "cd_catalog.xml" file in your browser
ʹÓÃä¯ÀÀÆ÷Àï²é¿´ÍêÕûµÄ "cd_catalog.xml" Îļþ
A Data Island can be used to access the XML file.
Êý¾Ýµº¿ÉÓÃÓÚ·ÃÎÊXMLÎļþ¡£
To get your XML document "inside" an HTML page, add an XML Data Island to the HTML page:
ÒªÔÚHTMLÒ³ÃæÖлñÈ¡XMLÎĵµ£¬±ØÐëÏòHTMLÒ³ÃæÖÐÌí¼ÓÒ»¸öXMLÊý¾Ýµº£º
<xml src="cd_catalog.xml" id="xmldso" async="false"> |
With the example code above, the XML file "cd_catalog.xml" will be loaded into an "invisible" Data Island called "xmldso". The async="false" attribute is added to make sure that all the XML data is loaded before any other HTML processing takes place
ͨ¹ýÉÏÊö°¸ÀýÖеĴúÂ룬XMLÎļþ "cd_catalog.xml" »á±»ÔØÈëÒ»¸ö“¿É¼û”µÄÊý¾Ýµº£¬¸ÃÊý¾Ýµº½Ð×ö“xmldso”¡£async="false" ÊôÐÔÉèÖÃÊÇΪÁËÔÚËùÓÐÆäËüµÄHTML´¦Àí¹ý³Ì·¢Éú֮ǰ£¬È·±£ËùÓеÄXMLÊý¾Ý¶¼Òѱ»¼ÓÔØ¡£
To make the XML data visible on the HTML page, you must "bind" the Data Island to an HTML element.
ΪÁËʹXMLÊý¾ÝÔÚHTMLÒ³ÃæÉϿɼû£¬Äã±ØÐë°ÑÊý¾Ýµº°ó¶¨µ½Ò»¸öHTMLµÄÔªËØÖС£
To bind the XML data to an HTML table, add a datasrc attribute to the table element, and add datafld attributes to the span elements inside the table data:
½«Êý¾Ýµº°ó¶¨µ½HTML±í¸ñÖУ¬²¢Îª±í¸ñÔªËØÌí¼ÓÒ»¸ö“datasrc” ÊôÐÔ£¬Í¬Ê±Îª±í¸ñÊý¾ÝÄڵēspan” ÔªËØÌí¼Ó“datafld” ÊôÐÔ£º
<table datasrc="#xmldso" width="100%" border="1"> <thead> <tr align="left"> </table> |
If you have IE 5.0 or higher: See how the XML data is displayed inside an HTML table.
Èç¹ûÄãµÄä¯ÀÀÆ÷ÊÇIE5ÒÔÉϵİ汾£º ¿´¿´XMLÊý¾ÝÊÇÈçºÎÔÚHTML±í¸ñÖÐÏÔʾµÄ¡£
<span> or <div> elements can be used to display XML data.
<span> »ò <div> ÔªËØ¿ÉÓÃÓÚÏÔʾXMLÊý¾Ý¡£
You don't have to use the HTML table element to display XML data. Data from a Data Island can be displayed anywhere on an HTML page.
Äã²¢²»Ò»¶¨ÒªÊ¹ÓÃHTML±í¸ñÔªËØÀ´ÏÔʾXMLÊý¾Ý¡£Êý¾ÝµºÖеÄÊý¾Ý¿ÉÒÔÔÚHTMLÒ³ÃæµÄÈκεط½ÏÔʾ³öÀ´¡£
All you have to do is to add some <span> or <div> elements to your page. Use the datasrc attribute to bind the elements to the Data Island, and the datafld attribute to bind each element to an XML element, like this:
ÄãÖ»ÐëÒªÎªÒ³ÃæÌí¼ÓһЩ<span>»ò<div>ÔªËØ¡£ÓÓdatasrc” ÊôÐÔ°ÑÔªËØ°ó¶¨Êý¾Ýµº£¬ÓÓdatafld” ÊôÐÔ°Ñÿ¸öÔªËØ°ó¶¨µ½Ò»¸öXMLÔªËØÉÏ£¬ÈçÏÂËùʾ£º
<br />Title: |
or like this:
»ò×Å£º
<br />Title: |
If you have IE 5.0 or higher: See how the XML data is displayed inside the HTML elements.
Èç¹ûÄãµÄä¯ÀÀÆ÷ÊÇIE5ÒÔÉϵİ汾£º²éÔÄXMLÊý¾ÝÊÇÔõÑùÔÚHTMLÔªËØÀïÏÔʾµÄ¡£
Note that if you use an HTML <div> element, the data will be displayed on a new line.
×¢Ò⣺Èç¹ûÄãʹÓÃÁËHTML <div> ÔªËØ£¬ÄÇôÊý¾Ý½«»áÏÔʾÔÚеÄÒ»ÐÐÄÚ¡£
With the examples above, you will only see one line of your XML data. To navigate to the next line of data, you have to add some scripting to your code.
ÔÚÉÏÊö°¸ÀýÖУ¬ÄãÖ»ÄÜ¿´µ½XMLÊý¾ÝÖеÄÒ»ÐУ»ÎªÁ˶ÔÏÂÒ»ÐÐÊý¾Ý½øÐвÙ×÷£¬Äã±ØÐëΪÄãµÄ´úÂëÌí¼ÓһЩ½Å±¾³ÌÐò¡£
Navigation has to be performed by a script.
ͨ¹ý½Å±¾³ÌÐò¿ÉÒÔʵÏÖÊý¾ÝµÄµ¼º½¡£
To add navigation to the XML Data Island, create a script that calls the movenext() and moveprevious() methods of the Data Island.
ΪÁ˸øÊý¾ÝµºÌí¼Óµ¼º½£¬¿ÉÒÔ´´Á¢Ò»¸ö½Å±¾³ÌÐò£¬ÃûΪÊý¾ÝµºµÄ“movenext()” ºÍ“moveprevious()” ·½·¨£¬¾ßÌåÈçÏ£º
<script type="text/javascript"> |
If you have IE 5.0 or higher: See how you can navigate through the XML records
Èç¹ûÄãµÄä¯ÀÀÆ÷ÊÇIE5ÒÔÉϵİ汾£º²éÔÄXML¼Ç¼ÊÇÔõÑù½øÐе¼º½µÄ¡£
With a little creativity you can create a full application.
Ö»ÐèÒªÒ»µãµã´´ÔìÁ¦£¬Äã¾Í¿ÉÒÔ´´½¨ÍêÕûµÄÓ¦ÓóÌÐò¡£
If you use what you have learned on this page, and a little imagination, you can easily develop this into a full application.
ÄãÖ»ÒªÔÚѧÍ걾ҳ֪ʶµÄͬʱ¼ÓÉÏÒ»¶¡µãÏëÏóÁ¦£¬¾Í¿ÉÒÔ´´½¨¸üÍêÕûµÄÓ¦ÓóÌÐò¡£
If you have IE 5.0 or higher: See how you can add a little fancy to this application.
ʹÓÃIE5ÒÔÉϵİ汾£º¿´¿´ÎÒÃÇΪÕâ¸öÓ¦ÓóÌÐòËù×öµÄһЩ¸Ä½ø¡£