°³Ã¼¿¡ ÀÇÇÏ¿© XML DOM(Document Object Model)¿¡ ³ªÅ¸³ ÂüÁ¶¸¦ ¹ÝȯÇÑ´Ù.
ÀÌ ¼Ó¼ºÀº ÀбâÀü¿ëÀÌ¸ç µðÆúÆ®°ªÀº ¾ø´Ù.
XMLDocument ¼Ó¼º¿¡ ÀÇÇØ ³ªÅ¸³ª´Â XML DOMÀ» ÂüÁ¶ÇÑ´Ù.
¿¤·¹¸àÆ®¿¡ persistenceÀÌ Àû¿ëµÇ¸é ³ëÃâµÈ XML document¿¡ ÀÚµ¿ÀûÀ¸·Î ÃÖ»óÀ§(root) ³ëµå(node)°¡ »ý¼ºµÈ´Ù. ÀÌ ³ëµå´Â documentElement ¼Ó¼ºÀ» ÅëÇÏ¿© Á¢¼ÓµÉ ¼ö ÀÖ´Ù.
setAttribute¸¦ ÅëÇÏ¿© ÃÖ»óÀ§(root) ³ëµå(node)¿¡ ¾ÖÆ®¸®ºäÆ®¸¦ Ãß°¡ÇÒ ¼ö ÀÖ°í,
appendChild·Î ÃÖ»óÀ§(root) ³ëµå(node)¿¡ ÀÚ½Ä ³ëµåµéÀ» Ãß°¡ÇÒ ¼ö ÀÖ´Ù.
XMLDocument ¼Ó¼ºÀº onload¿Í onsave À̺¥Æ®°¡ ¹ß»ýµÇ¾úÀ» ¶§¸¸, saveFavorite, saveHistory ºñÇìÀ̹ö¿¡¼ »ç¿ëÇÒ ¼ö ÀÖ´Ù.
| °³Ã¼ | script | XML | ±Ô°Ý | IE |
|---|
XMLDocument ¼Ó¼ºÀ» ÅëÇÏ¿© XML DOM¿¡ Á¢¼ÓÇÏ´Â ¹æ½ÄÀÇ ¿¹Á¦ÀÌ´Ù.
XML DOM¿¡¼ setAttribute ¸Þ¼µå¸¦ »ç¿ëÇÏ¿´´Ù.
<HTML>
<HEAD>
<META name="save" content="history">
<STYLE>.saveHistory {behavior:url(#default#savehistory);}</STYLE>
<SCRIPT>
function textSave(){
var oXMLDoc=persistObj.XMLDocument;
var oNode=oXMLDoc.createNode(1,'myNode', '');
oNode.text='A tree myNode.';
oNode.setAttribute('desc',persistObj.innerHTML);
oXMLDoc.documentElement.insertBefore(oNode, null);
}
function textLoad(){
var oXMLDoc=persistObj.XMLDocument;
var oItem=oXMLDoc.documentElement.childNodes.item(1);
persistObj.innerHTML=oItem.getAttribute('desc');
}
function textInsert(){
persistObj.innerHTML='»õ·Ó°Ô Ãß°¡µÈ ¹®ÀÚ¿ÀÌ´Ù.';
}
function textDelete(){
persistObj.innerHTML='';
}
</SCRIPT>
</HEAD>
<BODY>
<DIV id="persistObj" class="saveHistory" style="border:solid 1 blue;width:300;"
onsave="textSave()" onload="textLoad()"> </DIV>
<INPUT type="button" value="¹®ÀÚ¿ »ðÀÔ" onclick="textInsert()"><BR>
<INPUT type="button" value="¹®ÀÚ¿ »èÁ¦" onclick="textDelete()"><BR>
<SPAN style=width:100></SPAN><A href="../property/exp/wsaveHistory.html">´Ù¸¥ ÆäÀÌÁö·Î</A>
</BODY>
</HTML>