59.jQuery - XML 데이터 읽어오기 ( 09.Ajax )
공백 주의! 주석 주의!
| 04.Company.htm |
|
<html xmlns="http://www.w3.org/1999/xhtml"> <head>
<title>XML 파일 로드하기</title>
<script src="../jQuery/jquery-1.3.2-vsdoc2.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function()
{ $('#btn').click(function() { $.get('04.Company.xml', function(data)
{ $('#ctlGrid').empty(); $(data).find('Company').each(function()
{ var $entry = $(this);//현재 시점의 레코드의 엔트리를 읽어오기 //특성(Attribute)읽어오기 var html = "<div>" + $entry.attr('CompanyType') + "</div>"; html += "<div>" + $entry.find('CompanyNumber').text() + "</div>"; //하위 엔트리 읽어오기 $('#ctlGrid').append($(html)); }); }); });
});
</script> </head> <body>
<input type="button" id="btn" value="회사소개" />
<div id="ctlGrid"></div> </body> </html> |
| 04.Company.xml [ XML파일 ] |
|
<?xml version="1.0" encoding="utf-8"?> <Company CompanyType="Private"> <CompanyName>닷넷코리아</CompanyName> <CompanyNumber>123</CompanyNumber> <CompanyAddress>서울</CompanyAddress> <Name>레드플러스</Name> </Company> |
| 결과화면 |
[그림59-1] |
04.Company.htm
04.Company.xml