이 기사에서는 JS가 XML 파일 데이터를 읽고 데이터를 테이블 양식으로 표시하는 방법에 대해 설명합니다. 다음과 같이 참조에 대해 공유하십시오.
먼저 XML 파일을 살펴 보겠습니다.
<? xml version = "1.0"stubalone = "yes"?> <tudent> <stuinfo> <Thuname> Zhang Qiuli </stuname> <stusex> female </stusex> <stuage> 18 </stuage> </stuinfo> <stuinfo> <stuname> li wencai </stuname> </stuname> <Stusex> 31 </stuage> </stuinfo> <stuinfo> <Stuname> Li Siwen </stuname> <stusex> male </stusex> <stusex> 22 </stuage> </stuinfo> <stuinfo> <stuname> male </stuname> <stusex> <stusex> <stusex> </stuinfo> <stuinfo> <stuname> Sun Honglei </stuname> <stusex> male </stusex> <stuage> 32 </stuage> </stuinfo> <stuinfo> <stuname> ouyang junxiong </stusex> <stusex> <stusex> <stusex> </stuinfo> <Stuinfo> <Stuname> Jiang Lin </Stuname> <Stusex> 여성 </Stusex> <Stusex> Female </Stusex> <stusex> 23 </stuage> </stuinfo> <stuinfo> <Stuname> Xiaoxiao <Stusex> </stusex> <Stusex> 여성 </stusex> <stuage> 22 </stuage> </stuinfo> </student>
ASPX 페이지 코드 :
< %@ page language = "c#"autoeventwireup = "true"codebehind = "xml.aspx.cs"right1. "챕터 1. xml" %> <! doctype html public "-// dtd xhtml 1.0 transitional // en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd"> html xmlns ="http://www.w3.org/1999/xhtml "> <head runat"> <title> </title> </javascrip loadxmldoc (dname) {if (window.xmlhttprequest) {xhttp = new xmlhttprequest (); } else {xhttp = new ActiveXobject ( "microsoft.xmlhttp"); } xhttp.open ( "get", dname, false); xhttp.send ( ""); xhttp.responsexml을 반환합니다. } function readxml () {var xmldoc = loadxmldoc ( "wiching.xml"); // 지정된 노드를 가져옵니다 var divmsg = document.getElementById ( "xmlmsg"); var msg = "<테이블 테두리 = '1'id = 'mytable'> <tr> <th> name </th> <th> 성별 </th> <th> age </th> <tr>"; var 노드 = xmldoc.getElementsByTagName ( "stuinfo"); for (var i = 0; i <nodes.length; i ++) {msg+= "<tr>"; msg + = "<td>" + 노드 [i] .getElementsByTagName ( "stuname") [0] .firstChild.Nodevalue + "</td>"; msg + = "<td>" + 노드 [i] .getElementsByTagName ( "stusex") [0] .firstChild.Nodevalue + "</td>"; msg + = "<td>" + 노드 [i] .getElementsByTagName ( "stuage") [0] .firstChild.Nodevalue + "</td>"; msg += "</tr>"; } msg += "</table>"; divmsg.innerhtml = msg; }.위의 JS 조작은 주로 어린이의 사용을 피합니다 (Childrendes [0]은 때때로 Firefox에 나타나서 우리가 원하는 첫 번째 자식 노드 대신 "/n"을 얻기 때문에 직접 시도 할 수 있지만 어쨌든이 상황에 직면하여 IE 및 Firefox와 호환됩니다. 나는 다른 브라우저를 시도하지 않았습니다.
JavaScript에 대한 자세한 내용은이 사이트의 특별한 주제를 확인하십시오 : "JavaScript의 XML 파일 운영 기술 요약", "JavaScript의 AJAX 운영 기술 요약", "JavaScript의 JSON 운영 기술 요약", "JavaScript Switching 효과 및 기술 요약", JavaScript 검색 알연 기술의 요약 및 JavaScript Engorithme의 요약 ", JavaScript Search Enfection", "JavaScript" 기술 ","JavaScript 오류 및 디버깅 기술 요약 ","JavaScript 데이터 구조 및 알고리즘 기술 요약 ","JavaScript Traversal 알고리즘 및 기술의 요약 "및"JavaScript 수학 연산 사용 요약 "
이 기사가 모든 사람의 JavaScript 프로그래밍에 도움이되기를 바랍니다.