|  | 
 
| 
3 ~' r1 w: @( F0 [
x
请使用QQ关联注册PLM之家,学习更多关于内容,更多精彩原创视频供你学习!您需要 登录 才可以下载或查看,没有账号?注册 
  9 i; c2 X0 g6 R& [) l7 O
 
 + ?& H. F' z& M: ~4 Q[mw_shl_code=html,true]
 ) _$ q, N0 h- ~% z8 N$ D( r- [; ^7 g# V5 J! z
 <!DOCTYPE html>/ W6 y# \: ?$ ^- h# G
 <html>  a' u; k  V6 }9 Q. x
 <header>6 M8 H& z9 x) _/ L) f  J  w
 <style>
 # B* O8 I  T* Q: ?9 }' b) Q# }        table,
 & |' |5 m; G6 O  B; t+ B        tr,3 V, _  |0 O3 F0 I' I) ]$ ]: H0 X$ n
 th,% V9 m6 m% T( v
 td {9 h$ S" d4 v' g1 I9 k* y. D7 t
 border: 2px solid rgb(20, 59, 230);
 . n3 l) t1 S8 `6 r( {: f- G% |            border-collapse: collapse;
 - C) i2 u' Z$ v- n. q5 O5 K            text-align: center;% p5 ]- T& k3 G$ X% N
 }2 r5 k$ a, F- S+ F$ N8 x/ a6 c
 
 - y8 L' |: ]1 v. U7 g        th,
 5 o8 B3 n) _0 h  v+ W" }$ S        td {* M1 V1 H& P# w! b" p3 j- `: g
 padding: 5px;
 - Q" @) n. `  @0 @$ _+ |) Q! x1 d        }
 2 f- e1 w, m1 E    </style>4 J# V: ~% A. k' Y" `
 </header>4 e2 F0 `. C+ V: K4 c7 M+ Z( }) l
 
 ' ~( \& Y" ?  \( S# s* l1 t+ ?<body>
 . @! L9 ^! t  [. M/ @    <h1>xml http request object</h1>$ V1 n3 j$ x: A, _1 X1 W$ x
 <button type="button">Display Music</button>
 \5 n0 u) p4 g6 E! P    <button type="button">Previous</button>5 Y6 R' ~) Q9 O' P, o) m
 <button type="button">Next</button>( w% c7 ^3 g: R" ]
 <button type="button">get my music list</button>" V, D8 S/ b: h! I
 <table id="showMUSIC"></table>9 r- s3 m9 ?) u: P
 <table id="demo"></table>
 2 q1 f' Y, I5 V, ]9 @    <script>) A  K: A* ~' _* r3 \
 
 + T6 g) t0 }! H, ]8 ^/ r        var x, xmlhttp, xmlDoc;" _  A5 V% `) c; H/ R* y! H
 
 2 R, r7 f) O: @. |% y        xmlhttp = new XMLHttpRequest();
 3 w! v; B7 i. |0 [: j        xmlhttp.open("GET", "/files/music_list.xml", false);
 - j- S' o( o+ V$ x. y6 D$ Z        xmlhttp.send();: P0 x) y  A0 l0 w  b
 
 1 W4 [0 G3 v6 x4 D8 p        xmlDoc = xmlhttp.responseXML; 5 C3 c8 P9 Y6 x) F; j5 f
 var table = "<tr> <th>Owner</th> <th>User</th></tr>"& a. Q1 ^* E& u6 a8 H
 var content = document.getElementById('demo');0 B& p+ N- Z' O6 m# }
 var x = xmlDoc.getElementsByTagName('TRACK');- g' z; S7 R0 }. ~# s$ a$ ?; A
 for (i = 0; i <x.length; i++) { , ]$ Z8 O0 O9 Y
 table += "<tr onclick='displayMUSIC(" + i + ")'><td>";" \; `( ?7 w. X
 table += x.getElementsByTagName("ARTIST")[0].childNodes[0].nodeValue;; ?% M  o8 s) P1 u# z. t
 table += "</td><td>";
 , J; U& I6 ]& w9 a  table +=  x.getElementsByTagName("TITLE")[0].childNodes[0].nodeValue;+ p* t: u  V2 E" N3 L" h
 table += "</td></tr>";! j3 U1 }9 H  a( ]; W  p1 a
 }) H' e. j- i5 j0 ~( D
 1 G5 h9 E% s  c0 U
 document.getElementById("demo").innerHTML = table;
 $ J, {2 k' B- R+ Zvar i = 0;/ i3 A: a0 j9 ~6 m& _8 `% c9 G
 function next() {
 * p  Y0 G; ?$ y0 c            // 显示下一首歌曲,除非已到达最后一首
 $ _4 V- d8 E+ ?. s! T( V4 T            if (i < x.length - 1) {
 % u) U( Z. z* L" X! g! w1 x( i                i++;
 + {( u( \5 [$ J. A$ m0 f  k                displayMUSIC(i);- i( ?+ F( w" U. d* a3 {
 }
 ! u( R5 i% X. F7 _        }0 ^9 w5 g. }4 v9 o% x4 p
 + z  m+ P" u9 w. j6 M9 r$ D* E+ x9 J0 ~
 function previous() {! j; |9 p3 `" z
 // 显示上一首歌曲,除非已到达第一首) T8 y# }8 g* D4 `
 if (i > 0) {
 # N' k/ p& G- R; F8 I/ k                i--;. [. ^9 \- x) f8 j
 displayMUSIC(i);% D4 E! d, u* R3 j0 u
 }$ k. L+ [; }, }% J8 _
 }
 * ~2 e, V2 C5 n+ I* l" d8 Z
 : ?% c) y  n0 U: P" ?6 I        function displayMUSIC(i) {
 / l: {5 i9 ]# F# S6 @# d            document.getElementById("showMUSIC").innerHTML =
 $ u+ r& M4 @! d  Q; r                "<ul>" +# o& [, Z6 Z" F9 X& W
 "<li>曲目:" +( W5 I9 @" S( o7 t
 x.getElementsByTagName("TITLE")[0].childNodes[0].nodeValue + "</li>" +& G7 Y/ V' l$ H: A
 "<li>艺术家:" +
 0 y! ^3 v( @/ S6 p  v) A4 s3 w                x.getElementsByTagName("ARTIST")[0].childNodes[0].nodeValue + "</li>" +
 ; B" V' j* {$ O3 a, H5 C% T, `: M  P                "<li>专辑:" +
 / J$ `4 T: _! j3 Q; C; n                x.getElementsByTagName("ALBUM")[0].childNodes[0].nodeValue + "</li>" +
 ; q$ V5 N+ U' j8 z$ x7 F( C                "<li>国家:" +
 + Q0 T+ `8 K7 u1 A                x.getElementsByTagName("COUNTRY")[0].childNodes[0].nodeValue + "</li>" +- E+ U" d8 e9 h" h. R0 \; G
 "<li>公司:" +6 N5 R$ [# f) [% P" v8 G& a% H
 x.getElementsByTagName("COMPANY")[0].childNodes[0].nodeValue + "</li>" +/ }* Y( ~. M( O* _) F# k
 "<li>年份:" +( l0 N& U  d: g
 x.getElementsByTagName("YEAR")[0].childNodes[0].nodeValue + "</li>" +
 + R# m+ z& R% B9 [. u9 N                "</ul>";
 , D" K' \; p3 F; I* ^6 I        }
 & y0 [& Q# w" V: Q, i0 I* ~5 O9 F, r% o8 Y% W; e& f7 y+ W" d
 function loadDoc() {
 r5 A9 ^5 |+ O, o1 M; u  E2 d$ p
 - E' N4 }- A! v6 R1 H2 F            document.getElementById("demo").innerHTML = table;
 6 ?- k8 {9 B, s8 [. ?) u        }
 ; E; ?# o0 L2 S7 Y6 w3 K9 D8 t# p" ]9 e* d7 F" g/ c
 </script>; h- A# r3 i: @, ~; I/ t
 
 H8 U' ^  n. u' I6 e$ v- d8 J  t- r% w/ J7 j+ j: t! b
 </body>
 $ E! j" o+ W& ]) j6 C, j; X0 R, f( x! \4 \% ~) C3 {
 </html>. ]. y! Z  L# l# J/ s, ~1 J
 7 e' {$ P2 M* ]) J" w4 M' N
 ) I/ D2 r/ @5 N4 [8 T' e/ S$ H/ y! p
 [/mw_shl_code]* X9 I0 K2 I( [$ u- P
 , N$ [  }' a- A
 
 4 I5 m! i4 f6 G- {7 W0 f6 ]& j( U2 \4 V; s5 Y  F; E
 XML文件
 3 ~! p. x. {. W. t$ N1 i' N) S9 m- Q1 e3 K
 [mw_shl_code=xml,true]<?xml version="1.0" encoding="utf-8"?>
 # p% d  P, \# N( E8 J7 N<CATALOG>( y0 g4 g0 A/ Q! |3 T
 <TRACK>
 ( l* x0 u7 Q4 y  `4 w% O  [+ d<TITLE>再见</TITLE>
 8 U3 `  \! R$ f+ @3 h6 r<ARTIST>邓紫棋</ARTIST>- B# G9 m' @' Z. n5 l' K
 <ALBUM>新的心跳</ALBUM>
 8 Q5 o; U* \2 ]# ]<COUNTRY>中国</COUNTRY>$ M) A8 R, b( M
 <COMPANY>邓紫棋工作室</COMPANY>; c: l$ l) a- p2 S' e
 <YEAR>2016</YEAR>% @. D  v* A2 n8 ^" u/ E4 p2 C
 </TRACK>& u7 u$ u0 l! I3 K' z" J
 0 F. L; L7 l4 \) P. l8 ?& h) H
 <TRACK># }2 o, l+ B  l3 n
 <TITLE>All I Ask</TITLE>
 1 g: O7 y  }7 Q& H1 A" d( Q<ARTIST>Adele</ARTIST>' A9 E) N1 q8 d5 F. O" n
 <ALBUM>25</ALBUM>
 5 w4 _# i# {" {5 f2 D( Q<COUNTRY>英国</COUNTRY>
 + s! w2 y) d  w5 c0 `: q<COMPANY>XL Recordings</COMPANY>4 A$ D3 y; s; X$ E( k' W# Q9 _
 <YEAR>2015</YEAR>
 o/ ?. M# U- C</TRACK>- N( X) b$ N+ a+ ^0 a
 
 2 U, p* K8 b( P, K0 U& I/ M<TRACK>
 0 C/ q+ F6 h" o# U: X- Q/ b<TITLE>之乎者也</TITLE>
 ; L% E/ ?# z# F0 x/ S<ARTIST>罗大佑</ARTIST>, v4 a  F$ p3 f0 i
 <ALBUM>青春舞曲</ALBUM>* h" a, ~+ `' \1 k) Y
 <COUNTRY>中国</COUNTRY>
 * Y, r7 j' M; z( I) V<COMPANY>滚石唱片</COMPANY>) H! q0 g* H' w3 y; O6 v& F: j
 <YEAR>1982</YEAR>
 5 t5 [: _) z. v- w3 ]</TRACK>- H1 d( N8 Q1 e# C2 _8 n7 f
 . P" M# c2 G& T! O! n1 t! F, M
 <TRACK>& s1 i4 {' \# `8 ~6 D
 <TITLE>Never Be Alone</TITLE>
 ) n* A! S% y0 J- |: q  b<ARTIST>Shawn Mendes</ARTIST>) M0 P$ T; `, B8 m# Q! }
 <ALBUM>Handwritten</ALBUM>
 # U: \$ V2 G! m2 V: s* c8 _! b. O<COUNTRY>加拿大</COUNTRY>
 0 E7 `! ^$ B% h; E' Y  T<COMPANY>环球唱片</COMPANY>
 5 }+ y" _1 K# b<YEAR>2015</YEAR>
 & Y( I* `- \2 R! }. q4 G</TRACK>/ D4 K8 o# j) v, L
 8 K5 u2 Q1 j1 ?
 <TRACK>
 ) K9 a! f  P# w$ s<TITLE>慢慢</TITLE>; C& Q! n3 |2 U8 R+ L7 U
 <ARTIST>张学友</ARTIST>; i! m; q; ^- @& a: M9 B/ |- O
 <ALBUM>忘记你我做不到</ALBUM>+ J+ b5 M, }, d# f
 <COUNTRY>中国</COUNTRY>. ?* S5 |" ?' }$ l  V6 ^! k
 <COMPANY>环球唱片</COMPANY>
 8 M* j& `7 J* _. s) p<YEAR>1996</YEAR>4 j7 c7 N) }4 ^3 L6 e
 </TRACK>
 6 _: j( {4 B. |# ^3 T6 k/ y$ l* H, \) k: T5 X0 y
 <TRACK>
 . }  d5 t- [& T* `5 }! k+ B4 r1 s<TITLE>Complicated</TITLE>
 1 [0 E; Q* ^  r! h. |1 ^<ARTIST>Avril Lavigne</ARTIST>8 [. V/ T. Z- m; U$ I
 <ALBUM>Let Go</ALBUM>  m0 n) r# a. `& q1 z: g
 <COUNTRY>加拿大</COUNTRY>
 ( D2 S4 ?. W: i: W; L9 X8 Z<COMPANY>索尼音乐</COMPANY>) I0 `9 E9 l2 Z9 t' c2 C
 <YEAR>2002</YEAR>  P- {7 }7 N% b! u* J* L
 </TRACK>
 : n; x6 U9 r9 o
 ! [2 n* P: i, u; U1 r5 k<TRACK>
 : o" {4 A* z( h& V9 N- l$ n<TITLE>三生三世</TITLE>
 . G! B4 G# |6 o9 k0 X8 `# h2 p  L<ARTIST>张杰</ARTIST>; Z$ G' }) p* C  T, Y; C9 t
 <ALBUM>三生三世十里桃花</ALBUM>. W* z9 R1 {2 E1 ~# t
 <COUNTRY>中国</COUNTRY>
 2 o: O% B, `) y4 G) t<COMPANY>仁溪音乐</COMPANY># [% a$ V# l. c, E2 E
 <YEAR>2018</YEAR>
 % r* I, X6 o$ I7 {+ _2 R8 M5 j</TRACK>* f! q- o; Z' X' i
 1 U6 f8 Z5 P7 n( R1 D, Y: ^6 F
 <TRACK>+ v* J6 L, d/ C0 ^- q  M
 <TITLE>Five Hundred Miles</TITLE>5 c( C% k6 P5 O2 X9 i& B
 <ARTIST>Justin Timberlake</ARTIST>: T' a* y0 O2 F& M
 <ALBUM>Inside Llewyn Davis</ALBUM>
 K8 r7 Y7 }; w<COUNTRY>美国</COUNTRY>
 3 m1 {' k# Q, F. f0 G<COMPANY>华纳唱片</COMPANY>( ~" [5 f" g) ^
 <YEAR>2013</YEAR>
 & ?3 Q1 G' f1 W' {2 s</TRACK>
 & I6 N5 G: U+ D8 _, h5 {& F
 ' c+ r& z2 d/ U% u( p<TRACK># E8 F9 g% T' ~: m% }9 T3 M% d& O4 s
 <TITLE>演员</TITLE>6 E1 v+ }& K: {& O
 <ARTIST>薛之谦</ARTIST>
 # Q% Y$ _8 A+ j. s  c) X. H<ALBUM>绅士</ALBUM>
 7 {' C. @/ Y: q9 K2 K; ^. a<COUNTRY>中国</COUNTRY>, B7 f5 F- [4 k# T
 <COMPANY>海蝶音乐</COMPANY>% h: |$ t' s; V# ^& S4 F- c
 <YEAR>2016</YEAR>
 " u1 E" P" G" {* r" t- v  [: @</TRACK>$ F9 N& J/ c$ `( Z
 
 : {% H1 b/ N8 L. m0 C& P<TRACK>0 A5 S7 f  S  [! x) r! f# ]
 <TITLE>Numb</TITLE>
 : ?1 {5 V+ F6 E<ARTIST>Linkin Park</ARTIST>
 % ~: F1 t  a# O9 \) @  N<ALBUM>Meteora</ALBUM>' S9 ?% r2 d9 @" }1 `0 `
 <COUNTRY>美国</COUNTRY># U9 p2 d5 t) B& M$ R
 <COMPANY>华纳唱片</COMPANY>
 6 U. v' A- k" m9 m" Q<YEAR>2003</YEAR>
 ! m+ ^' Q% m2 a9 a. b& [</TRACK>! P& Q3 E7 ]$ w
 
 - `3 z  s/ f) N) O# o<TRACK>! g- D0 D9 f6 ]
 <TITLE>给未来的自己</TITLE>
 / N5 o' P$ Z4 m  d+ a( K<ARTIST>梁静茹</ARTIST>$ D1 k  U; Q$ V. I
 <ALBUM>崇拜</ALBUM>2 l: N, w2 Q& |. J0 `* p. @
 <COUNTRY>马来西亚</COUNTRY>
 0 E: W3 z5 n9 E9 h  h<COMPANY>相信音乐</COMPANY>9 ~7 f- m' _. C7 t5 l
 <YEAR>2007</YEAR>- Z  f' @; J" P! w
 </TRACK>% E4 D6 k. y5 ~4 x1 U- c
 
 , v2 U# V# w3 z0 |5 V  i& K<TRACK>6 g$ r- i! Y2 K; ]$ P
 <TITLE>The Monster</TITLE>1 G  s$ ?# I5 ]: z( _' h0 E6 M
 <ARTIST>Rihanna</ARTIST>& t8 T( g$ V+ E8 k" a" [
 <ALBUM>The Marshall Mathers LP2</ALBUM>
 6 Q4 i4 _9 g9 A$ j7 b<COUNTRY>巴巴多斯</COUNTRY>
 * h% j0 e$ g' w! Q<COMPANY>环球唱片</COMPANY>) E6 B! J- O' h2 H+ T9 z! N
 <YEAR>2013</YEAR>' M8 M0 D% U& x9 u
 </TRACK>' c. P: W( a4 G
 - n& a* @: A; L  A# R! K" v
 <TRACK>: ^% i3 `) G# W
 <TITLE>我终于失去了你</TITLE>
 ' G' L: w( N2 v! t3 R<ARTIST>赵传</ARTIST>
 6 Z# q; u  M( y( D  i7 M$ l; U<ALBUM>我终于失去了你</ALBUM>/ i7 r) N% w: R+ t9 ]2 D& j
 <COUNTRY>中国</COUNTRY>
 ' N" x# X) y/ ^* s8 h, w) v. w<COMPANY>滚石唱片</COMPANY>
 % h" A) L' e6 f7 k3 J- W) ~- @<YEAR>1989</YEAR>/ W8 ]; J( L' N8 U& r6 @+ X
 </TRACK>, s! P: i$ r& }/ N! q$ ]
 
 ; m* r% e' d. T: A<TRACK>
 + _- J$ U% j' M% ?0 o4 T! w<TITLE>Main Titles</TITLE>
 ) o8 W, p/ t! f. N) [<ARTIST>Ramin Djawadi</ARTIST>) \3 A0 v6 o' C5 Q# l( w* b
 <ALBUM>Game of Thrones</ALBUM>3 }# T% e2 t9 L! b4 |0 h
 <COUNTRY>德国</COUNTRY>
 3 C+ C  @' n/ N2 @6 w) H<COMPANY>索尼音乐</COMPANY>* V( q4 J% C# D7 A/ j7 N' z# [
 <YEAR>2011</YEAR>
 & ]& j' a2 c6 l) \% E9 ]8 d</TRACK>+ q8 v" `- e* g3 O5 r, P
 
 5 X' E% k# a2 {<TRACK>$ r$ {2 [; ~) H; c; y# Q4 P4 S
 <TITLE>传奇</TITLE>$ g/ w& e: M/ i' @
 <ARTIST>李健</ARTIST>
 . g/ p0 l4 }; @2 |  f1 K5 q# \<ALBUM>似水流年</ALBUM>$ b* f6 Y$ a: G4 Y1 S
 <COUNTRY>中国</COUNTRY>7 I2 W8 n# N+ z$ w% i
 <COMPANY>北京完美坚持文化艺术工作室</COMPANY>( [8 Y7 T; j# |
 <YEAR>2003</YEAR>) H6 {/ _2 y9 Z
 </TRACK>. V2 \: \, K: h! p
 
 9 h3 i5 ?# \7 J3 Y& Z/ ?1 U<TRACK>
 ; e+ I3 ~4 G" m, @8 |0 Z<TITLE>完美生活</TITLE>2 A# k! f* k, Z+ ~
 <ARTIST>许巍</ARTIST>5 i# a7 R) O% s3 h! C3 R
 <ALBUM>时光漫步</ALBUM>
 $ N, V, H# o0 l+ o6 d4 x: ?<COUNTRY>中国</COUNTRY>
 " H$ ~6 R2 ^) C# W% J. C<COMPANY>金牌大风</COMPANY>
 0 X  {& e5 D, r# h5 a5 N<YEAR>2002</YEAR>
 . ]! O2 t- ?8 i</TRACK>
 0 B( E& `. l- t% E" e$ V" r</CATALOG>[/mw_shl_code]* X2 S6 L7 ^. l
 
 | 
 |