XML
werkend voorbeeld
http://www.manutechnica.com/tutorials/ajax/phphulp/xml/
Je kan ook Ajax gebruiken als xml lezer. Wat xml is en betekent, kan je wel opzoeken.
Het Ajax object leest de file xml.xml. Hier schreef ik als voorbeeld een recursieve functie die de volledige hiërarchische structuur van de xml file doorloopt en visueel toont.
Voorlopig heb ik het gevoel dat dit niet werkt met IE.
index.php
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
<?php
echo '<html>
<head>
<script src="ajax.js" type="text/javascript"></script>
<script src="js.js" type="text/javascript"></script>
<style>
#menuDiv {border: 1px solid #333333; width: 250px; float: left; margin: 0 3px 0 0;}
#content{border: 1px solid #333333; width: 450px; float: left;}
.verborgen{display: none;color: #ff0000; font-size: 13px;}
.xml_div {min-height: 17px; min-width: 60px; border: 1px solid #000000; margin: 3px 3px 3px 10px; clear: both;}
.xml_attr {padding: 2px; height: 17px; border: 1px solid #000000; margin: 1px 1px 5px 1px; float: left;}
.xml_waarde{color: #00ff00;}
.xml_naam{color: #0000ff; margin: 0 4px 0 0;}
.xml_text{color: #777777; margin: 4px }
.clear{clear: both;}
</style>
</head>
<body>
<h3>XML voorbeeld</h3>
<div>Voorbeeld van Ajax als XML lezer. Get gaat om <a href="xml.xml">Dit xml bestandje</a> dat ik vond bij w3c.</div>
<div id="boodschap_naam"></div>
<input value="klik" onclick="klik();" type="button">
</body>
</html>
';
?>
echo '<html>
<head>
<script src="ajax.js" type="text/javascript"></script>
<script src="js.js" type="text/javascript"></script>
<style>
#menuDiv {border: 1px solid #333333; width: 250px; float: left; margin: 0 3px 0 0;}
#content{border: 1px solid #333333; width: 450px; float: left;}
.verborgen{display: none;color: #ff0000; font-size: 13px;}
.xml_div {min-height: 17px; min-width: 60px; border: 1px solid #000000; margin: 3px 3px 3px 10px; clear: both;}
.xml_attr {padding: 2px; height: 17px; border: 1px solid #000000; margin: 1px 1px 5px 1px; float: left;}
.xml_waarde{color: #00ff00;}
.xml_naam{color: #0000ff; margin: 0 4px 0 0;}
.xml_text{color: #777777; margin: 4px }
.clear{clear: both;}
</style>
</head>
<body>
<h3>XML voorbeeld</h3>
<div>Voorbeeld van Ajax als XML lezer. Get gaat om <a href="xml.xml">Dit xml bestandje</a> dat ik vond bij w3c.</div>
<div id="boodschap_naam"></div>
<input value="klik" onclick="klik();" type="button">
</body>
</html>
';
?>
js.js
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
http = createHTTPHandler();
function klik()
{
url = 'xml.xml';
http.open("GET", url, true);
http.onreadystatechange = handleHttpResponse;
http.send(null);
}
function handleHttpResponse()
{
if(http.readyState < 4)
{
}
if(http.readyState == 4)
{
var result = '';
var resultaat = http.responseXML ;
result += getNodes(resultaat);
document.getElementById('boodschap_naam').innerHTML = result;
}
}
function getNodes(children)
{
var result = '';
for (var i = 0; i < children.childNodes.length; i++)
{
if (children.childNodes[i].localName == null)
{
//result += ' <div class="xml_leeg">NULL</div>';
continue;
}
result += ' <div class="xml_div">' + children.childNodes[i].localName;
if (children.childNodes[i].firstChild == children.childNodes[i].lastChild)
result += ' <div class="xml_text">' + children.childNodes[i].textContent +'</div>';
//result += ' <div class="xml_text">' + children.childNodes[i].getNodeValue() +'</div>';
result += getAttr(children.childNodes[i]);
result += getNodes(children.childNodes[i]);
result += "</div> ";
}
return result;
}
function getAttr(node)
{
var result = '';
for (var i = 0; i < node.attributes.length; i++)
{
if (node.attributes[i].localName == null)
continue;
result += ' <div class="xml_attr"><span class="xml_naam">' + node.attributes[i].localName + '</span> <span class="xml_waarde">' + node.attributes[i].value + '</span>';
result += "</div> ";
}
if (result !='')
result = '<div class="clear"></div>' + result +'<div class="clear"></div>';
return result;
}
function klik()
{
url = 'xml.xml';
http.open("GET", url, true);
http.onreadystatechange = handleHttpResponse;
http.send(null);
}
function handleHttpResponse()
{
if(http.readyState < 4)
{
}
if(http.readyState == 4)
{
var result = '';
var resultaat = http.responseXML ;
result += getNodes(resultaat);
document.getElementById('boodschap_naam').innerHTML = result;
}
}
function getNodes(children)
{
var result = '';
for (var i = 0; i < children.childNodes.length; i++)
{
if (children.childNodes[i].localName == null)
{
//result += ' <div class="xml_leeg">NULL</div>';
continue;
}
result += ' <div class="xml_div">' + children.childNodes[i].localName;
if (children.childNodes[i].firstChild == children.childNodes[i].lastChild)
result += ' <div class="xml_text">' + children.childNodes[i].textContent +'</div>';
//result += ' <div class="xml_text">' + children.childNodes[i].getNodeValue() +'</div>';
result += getAttr(children.childNodes[i]);
result += getNodes(children.childNodes[i]);
result += "</div> ";
}
return result;
}
function getAttr(node)
{
var result = '';
for (var i = 0; i < node.attributes.length; i++)
{
if (node.attributes[i].localName == null)
continue;
result += ' <div class="xml_attr"><span class="xml_naam">' + node.attributes[i].localName + '</span> <span class="xml_waarde">' + node.attributes[i].value + '</span>';
result += "</div> ";
}
if (result !='')
result = '<div class="clear"></div>' + result +'<div class="clear"></div>';
return result;
}
xml.xml
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<?xml version="1.0" encoding="ISO-8859-1"?>
<bookstore>
<book category="COOKING">
<title lang="en">Everyday Italian</title>
<author>Giada De Laurentiis</author>
<year>2005</year>
<price>30.00</price>
</book>
<book category="CHILDREN">
<title lang="en">Harry Potter</title>
<author>J K. Rowling</author>
<year>2005</year>
<price>29.99</price>
</book>
<book category="WEB">
<title lang="en">Learning XML</title>
<author>Erik T. Ray</author>
<year>2003</year>
<price>39.95</price>
</book>
</bookstore>
<bookstore>
<book category="COOKING">
<title lang="en">Everyday Italian</title>
<author>Giada De Laurentiis</author>
<year>2005</year>
<price>30.00</price>
</book>
<book category="CHILDREN">
<title lang="en">Harry Potter</title>
<author>J K. Rowling</author>
<year>2005</year>
<price>29.99</price>
</book>
<book category="WEB">
<title lang="en">Learning XML</title>
<author>Erik T. Ray</author>
<year>2003</year>
<price>39.95</price>
</book>
</bookstore>
Ongetwijfeld kan je zelf nuttiger toepassingen vinden.
Je zou bv. een kalender rechtstreeks van de xml file kunnen lezen en functies schrijven die de kalender op het scherm toont.
« vorige pagina | volgende pagina »