Combination of XML and HTML

Source: Internet
Author: User
1. xml limitations
Currently, content data of many web sites is stored in databases or data files. For Web Program For developers, if they want to extract useful information from the database, the traditional method is to write script programs (such as VBScript, JavaScript, CGI, ASP, Perl, etc.) on the server ), you can obtain related records by executing SQL queries on the database, and organize the query results into HTML pages and return them to the client. You can view the final results in the browser.
To improve the flexibility and scalability of system services and extend the scope of service objects, many commercial websites provide business rules, raw data, and representations as independent services as much as possible. The HTML data display method obviously does not meet this requirement. Therefore, the raw data is stored in XML documents, and the use of style sheet file display content is the advantage of XML technology for e-commerce. However, in essence, the XSL technology is not data-oriented. It is a format conversion technology, and its display methods and methods are far less abundant than HTML. For programmers, an ideal solution is to combine HTML and XML technologies to complement each other, so that the true original data can maintain its original meaning and structure at the same time, we can also make full use of the ever-changing HTML display skills. XML data island is the product of this technology fusion. It uses the <XML> tag to directly embed XML data into HTML pages, thus realizing the complementary advantages of the two.
2. Processing Method of Data Island in IE
To be able to process such embedded XML Code Internet Explorer 4.0 (IE 4.0) introduces DSO (Data Source objects, data source object) technology, which is implemented using Java applet.
For example:
<APPLET code = "com. Ms. xml. DSO. xmldso. Class" id = "xmldso" width = 0 Height = 0 mayscript = true>
<Param name = "url" value = "myxml. xml">
</APPLET>
In the preceding example, the code attribute specifies the DSO Java Applet. The mayscript attribute ensures that the client script can process data objects, and the param tag specifies the location of the XML document.
The limitation of using Java is that the xml url address can only be described in the HTML document, but the XML tag cannot be directly embedded in it, which is still different from the real data island solution. Microsoft has extended the DSO Technology in Internet Explorer 5.0 (IE 5.0), breaking through previous restrictions and truly integrating HTML and XML. You can directly use the <XML> tag on an HTML page.
For example:
<HTML>
<XML id = "xmldso">
<? XML version = "1.0"?>
Some XML ......
</XML>
As long as the ID of each data island is unique, the data island can be embedded wherever necessary on the page, and these DSO are mutually independent.
In addition to this direct embedding method in the preceding example, you can also use external references to link data islands.
For example:
<XML id = "xmldso" src = "myxml. xml">
</XML>
In this way, only when the company's customer objects continue to use IE 4.0, and to solve the compatibility issues of these customers, Java applet is the option that programmers should consider.
In the DSO technology implemented by IE 5.0, if the data is obtained by querying the database through the SQL language, they are stored in the ADO (ActiveX Data Objects) record set. The server sends this ActiveX Control (usually an ADO record set) to the client for further processing by the client script program. In fact, IE 5.0 processes the XML data island as a special ADO record set.
3. XML Data Binding
(1) ADO record set ing

Each primary element in XML is mapped to a record in the ADO record set, and the child element is mapped to the field (also called the field) in the record set ).
For example, Books. XML in XML data island exists as follows:
<XML id = "xmldso">
<? XML version = "1.0"?>
<Booklist>
<Book>
<Title> straight talk about computers </title>
<ISBN> 72-80088-005 </ISBN>
</Book>
<Book>
<Title> gourmet microwave </title>
<ISBN> 72-80081-082 </ISBN>
</Book>
</Booklist>
</XML>
In this case, the mapped ADO record set is:

(2) Binding to HTML elements
After embedding the data island in the HTML document, you can bind the XML data island with the HTML element. Each DSO entry (data island) has a unique ID number. First, set the datasrc attribute in the HTML element to the corresponding ID to associate the HTML element with the data island. Then, the extracted XML element is determined by setting the dataworkflow attribute value.
For example, the code bound to the DIV element is as follows:
<Div id = title datasrc = # xmldso dataworks = "title"> </div>
<Div id = Price datasrc = # xmldso dataworks = "ISBN"> </div>
Note: not all HTML elements can be bound to the XML data island. Currently, the DSO binding mechanism supports the following elements:
A. Applet, button, Div, frame, IFRAME, IMG, and input (the types are checkbox, hidden, label, password, radio, and text), label, marquee, select, span, table, and textarea.
(3) Explicit XML data in tabular form
If the XML data is bound with the table element, it can be automatically displayed as a multi-row table.
For example, the Code for binding XML data to table elements is as follows:
<Table border = 1 datasrc = "# xmldso">
<Thead>
<Tr> <TH> title </Th>
<TH> ISBN </Th> </tr>
</Thead>
<Tbody>
<Tr> <TD> <Div dataworks = "title"> </div> </TD>
<TD> <Div dataworks = "ISBN">
</Div> </TD> </tr>
</Tbody>
</Table>
In this way, the datasrc attribute in the table element is set to # xmldso to bind the two. The table contains two parts: the header (thead) and the table body (tbody. Each <book> element is displayed as a table in a row. which data is displayed in each column is specified by the dataworks attribute in the DIV element.
4. xml nesting
Generally, the result set we obtain from the database may be large, so when the server returns to the client, the data will be divided into several pages for transmission. In this case, the datapagesize attribute in the table element can be used to specify the number of entries in the record set on each page.
For example:
<Table datasrc = "# xmldso" datapagesize = 10>
Obviously, if the XML data format is symmetric, the effect will be good whether it is mapped to the ADO record set or bound to the table element. In practical applications, there are also many examples of asymmetric XML data. For example, there may be more than one author in a book, which may cause some trouble in ing and binding. The solution is to use nesting. Each row of table still corresponds to a primary element, and each column also corresponds to a child element. For repeated elements, nested tables are used. Let's assume that in books. XML, the first book is Dean straight, and the second is Charlotte Cooper, Shelley Burke, and Regina Murphy. The binding process is as follows:
● Create a table element and assign the data island ID to the dataworks attribute;
● For separate XML elements, such as <ISBN>, create a TD element and set the corresponding dataworks attribute;
● For duplicate elements, a table is nested in the TD element;
● The author information is displayed in a single row and single column.
Note that the dataworks attribute must be set to "$ text" to ensure that all contents of the nested element are displayed in the specified element.
The complete HTML code is as follows:
<Table border = 1 datasrc = "# xmldso">
<Thead> <tr> <TH> title </Th>
<TH> ISBN </Th>
<TH> author </Th> </tr> </thead>
<Tbody>
<Tr> <TD>
<Div dataworks = "title"> </div> </TD>
<TD> <Div dataworks = "ISBN">
</Div> </TD>
<TD>
<Table border = 0 datasrc = "# xmldso" dataworks = "author">
<Tr> <TD> <span dataworks = "$ text"> </span> </TD> </tr>
</Table>
</TD>
</Tr> </tbody>
</Table>
In fact, the best way to use DSO is to deal with symmetric structured data. The more effective way to process asymmetric data is to use the DOM technology we will introduce later.
5. Application of DSO Technology
(1) access element attributes

Using DSO to access element attributes is simple. You can directly process attributes by sub-element.
For example:
<Book ISBN = "9-001-122-12">
......
</Book>
In this way, when bound to an HTML table, you can directly process it by sub-element:
<TD> <span dataworks = "ISBN"> </span> </TD>
If the attribute name is the same as the sub-element name, add "!" before the element name. .
(2) traverse Record Sets
DSO treats XML data island as an ADO record set. It can use various methods provided by ADO to access the data source, especially when you bind data island to HTML elements such as span, Div, and input. These elements usually display the first record of the record set. to traverse and browse the record set, you can use the ADO method: Move, movefirst, movelast, movenext, and moveprevious. For example, if you create a button response function, you can click "Next" to view corresponding records one by one.
For example:
<XML id = "xmldso" src = "books. xml">
</XML>
Sub btnnext_onclick ()
Xmldso. recordset. movenext
End sub
(3) integration with the script language
Some users are used to writing script languages. using DSO technology, they can also be well integrated with various scripts.
For example (using VB script as an example), the Code for accessing the record set is as follows:
Dim rsbooks
Set rsbooks = xmldso. recordset
Value of the access field (child element:
Dim stitle
Stitle = rsbooks ("title ")
You can use the innertext and innerhtml attributes to pass the obtained value to the HTML element. For example, there is a div element named divtitle. The assignment code is as follows:
Divtitle. innertext = stitle
The script program can also process many DSO events. The following table lists some of these events:
in a script, you can use the for attribute in the
In addition to displaying record data, the script program can also perform quick query, sorting, editing, and other operations on the record set. However, although the ADO technology provides methods like sortcolumn and sortascending to sort XML data, the effect is not as good as that in XSL, therefore, we recommend that you fully use the XSL technology to implement this function.
other functions, such as adding, deleting, and modifying record sets using scripts, or displaying HTML tables on pages, are not described here, the usage is similar to the previous operation. It should be noted that all operations on the DSO object are completed on the user end, which is actually a copy of the server data object, the advantage of doing so is to avoid the network from being burdened with a large amount of data communication. However, any operations performed by the user end have no impact on the data stored on the server. If you want to modify the server record, you must use the data exchange technology between the client and the server, we will introduce this in the future.

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.