\u0412 \u044d\u0442\u043e\u0439 \u0433\u043b\u0430\u0432\u0435 \u043c\u044b \u043e\u0431\u0441\u0443\u0434\u0438\u043c XML DOM Traversing.\u00a0\u0412\u00a0\u043f\u0440\u0435\u0434\u044b\u0434\u0443\u0449\u0435\u0439 \u0433\u043b\u0430\u0432\u0435\u00a0\u043c\u044b \u0438\u0437\u0443\u0447\u0430\u043b\u0438, \u043a\u0430\u043a \u0437\u0430\u0433\u0440\u0443\u0436\u0430\u0442\u044c XML-\u0434\u043e\u043a\u0443\u043c\u0435\u043d\u0442 \u0438 \u0430\u043d\u0430\u043b\u0438\u0437\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u043f\u043e\u043b\u0443\u0447\u0435\u043d\u043d\u044b\u0439 \u0442\u0430\u043a\u0438\u043c \u043e\u0431\u0440\u0430\u0437\u043e\u043c \u043e\u0431\u044a\u0435\u043a\u0442 DOM.\u00a0\u042d\u0442\u043e\u0442 \u043f\u0440\u043e\u0430\u043d\u0430\u043b\u0438\u0437\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u044b\u0439 \u043e\u0431\u044a\u0435\u043a\u0442 DOM \u043c\u043e\u0436\u0435\u0442 \u0431\u044b\u0442\u044c \u043f\u0440\u043e\u0439\u0434\u0435\u043d.\u00a0\u041e\u0431\u0445\u043e\u0434 \u2014 \u044d\u0442\u043e \u043f\u0440\u043e\u0446\u0435\u0441\u0441, \u0432 \u043a\u043e\u0442\u043e\u0440\u043e\u043c \u0437\u0430\u0446\u0438\u043a\u043b\u0438\u0432\u0430\u043d\u0438\u0435 \u0432\u044b\u043f\u043e\u043b\u043d\u044f\u0435\u0442\u0441\u044f \u0441\u0438\u0441\u0442\u0435\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438\u043c \u043e\u0431\u0440\u0430\u0437\u043e\u043c, \u043f\u0440\u043e\u0445\u043e\u0434\u044f \u043a\u0430\u0436\u0434\u044b\u0439 \u044d\u043b\u0435\u043c\u0435\u043d\u0442 \u043f\u043e\u044d\u0442\u0430\u043f\u043d\u043e \u0432 \u0434\u0435\u0440\u0435\u0432\u0435 \u0443\u0437\u043b\u043e\u0432.<\/p>\n\n\n\n
\u0412 \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0435\u043c \u043f\u0440\u0438\u043c\u0435\u0440\u0435 (traverse_example.htm) \u0434\u0435\u043c\u043e\u043d\u0441\u0442\u0440\u0438\u0440\u0443\u0435\u0442\u0441\u044f \u043e\u0431\u0445\u043e\u0434 DOM. \u0417\u0434\u0435\u0441\u044c \u043c\u044b \u043f\u0440\u043e\u0445\u043e\u0434\u0438\u043c \u0447\u0435\u0440\u0435\u0437 \u043a\u0430\u0436\u0434\u044b\u0439 \u0434\u043e\u0447\u0435\u0440\u043d\u0438\u0439 \u0443\u0437\u0435\u043b \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430 <Employee>.<\/p>\n\n\n\n
<!DOCTYPE html>\n<html>\n <style>\n table,th,td {\n border:1px solid black;\n border-collapse:collapse\n }\n <\/style>\n <body>\n <div id = \"ajax_xml\"><\/div>\n <script>\n \/\/if browser supports XMLHttpRequest\n if (window.XMLHttpRequest) {\/\/ Create an instance of XMLHttpRequest object. \n code for IE7+, Firefox, Chrome, Opera, Safari\n var xmlhttp = new XMLHttpRequest();\n } else {\/\/ code for IE6, IE5\n var xmlhttp = new ActiveXObject(\"Microsoft.XMLHTTP\");\n }\n \/\/ sets and sends the request for calling \"node.xml\"\n xmlhttp.open(\"GET\",\"\/dom\/node.xml\",false);\n xmlhttp.send();\n\n \/\/ sets and returns the content as XML DOM\n var xml_dom = xmlhttp.responseXML;\n\t\n \/\/ this variable stores the code of the html table\n var html_tab = '<table id = \"id_tabel\" align = \"center\">\n <tr>\n <th>Employee Category<\/th>\n <th>FirstName<\/th>\n <th>LastName<\/th>\n <th>ContactNo<\/th>\n <th>Email<\/th>\n <\/tr>';\n var arr_employees = xml_dom.getElementsByTagName(\"Employee\");\n \/\/ traverses the \"arr_employees\" array\n for(var i = 0; i<arr_employees.length; i++) {\n var employee_cat = arr_employees[i].getAttribute('category');\n \n \/\/ gets the value of 'category' element of current \"Element\" tag\n\n \/\/ gets the value of first child-node of 'FirstName' \n \/\/ element of current \"Employee\" tag\n var employee_firstName =\n arr_employees[i].getElementsByTagName('FirstName')[0].childNodes[0].nodeValue;\n\n \/\/ gets the value of first child-node of 'LastName' \n \/\/ element of current \"Employee\" tag\n var employee_lastName =\n arr_employees[i].getElementsByTagName('LastName')[0].childNodes[0].nodeValue;\n\n \/\/ gets the value of first child-node of 'ContactNo' \n \/\/ element of current \"Employee\" tag\n var employee_contactno = \n arr_employees[i].getElementsByTagName('ContactNo')[0].childNodes[0].nodeValue;\n\n \/\/ gets the value of first child-node of 'Email' \n \/\/ element of current \"Employee\" tag\n var employee_email = \n arr_employees[i].getElementsByTagName('Email')[0].childNodes[0].nodeValue;\n\n \/\/ adds the values in the html table\n html_tab += '<tr>\n <td>'+ employee_cat+ '<\/td>\n <td>'+ employee_firstName+ '<\/td>\n <td>'+ employee_lastName+ '<\/td>\n <td>'+ employee_contactno+ '<\/td>\n <td>'+ employee_email+ '<\/td>\n <\/tr>';\n }\n html_tab += '<\/table>'; \n \/\/ adds the html table in a html tag, with id = \"ajax_xml\"\n document.getElementById('ajax_xml').innerHTML = html_tab; \n <\/script>\n <\/body>\n<\/html><\/pre>\n\n\n\n