|
请使用QQ关联注册PLM之家,学习更多关于内容,更多精彩原创视频供你学习!
您需要 登录 才可以下载或查看,没有账号?注册
x
0 d5 Y" K, U& ^& k: @6 ?/ t+ v# ~
6 z" b+ z9 l: s
/ H4 I* l2 I( l, K7 x" @[mw_shl_code=html,true]1 h/ j1 _0 `) q7 K2 l4 x
+ Q- d( K1 S- y* k* k<!DOCTYPE html>3 r) V+ _/ Z% a- [3 |
<html>! i4 y0 h* i( K0 I. q
<header>3 z9 D" u9 k |& H( ?
<style>
" j! @3 E7 z! Z. H+ A4 L( y" A table,
$ `; m+ k3 @& h3 T& s [: n* P tr,3 U C# z e. N8 s3 x9 K6 ?
th,
$ j5 c l( G5 N td {8 l8 o3 r9 @" b/ g. l
border: 2px solid rgb(20, 59, 230);9 `# K* Y" Z7 Q" v/ C# j
border-collapse: collapse;# E/ M; v( o4 I% V k$ ]
text-align: center;
/ K( G ~! X' y; ^( I3 F( _ }" |, P" Y8 p7 y$ h2 \ s$ h# f
) \8 c+ j0 r' o5 ~( M4 _# O) D. a th,
2 y" k* s' j" ` td {
* F# m6 m2 }6 O8 J padding: 5px;- t) x/ b# d; E" L3 R e
}
6 ^4 z @9 G6 c7 H; V3 j% }3 V6 } </style>2 B: }5 R+ J* M' M6 u' E$ x
</header>
/ ^/ l* [4 j; F: W8 s' i3 m' G8 V9 o
<body># Q1 t5 N w0 \3 l% c n
<h1>xml http request object</h1>9 o/ \6 [; I6 f9 S( a' R1 o1 |
<button type="button">Display Music</button>
! e" [! t( S1 h7 X, q <button type="button">Previous</button>
* S- I- N: j8 [" D% k) z <button type="button">Next</button>$ b& c6 @ k& d+ ~$ n0 U0 O$ r
<button type="button">get my music list</button>
6 c$ {# L7 z: L2 f* }) x <table id="showMUSIC"></table>
. G, a: w( f, n m a% n8 d0 Y <table id="demo"></table>
; M4 {9 e0 r" D6 W( | <script>8 |2 h) v5 v8 _
( _" L% u' `1 g; k. C5 T; O) M' |
var x, xmlhttp, xmlDoc;% p& q$ a& G/ |; q. Z
# o$ C6 e# X+ O1 @" o xmlhttp = new XMLHttpRequest();
- ]3 }' W: j* G) {+ | xmlhttp.open("GET", "/files/music_list.xml", false);; n3 U" o8 P+ r! C: P, |
xmlhttp.send();
+ W4 T' ^4 w1 K; c5 p; `1 D* r* ]# M' J2 Y# C$ y& O; \
xmlDoc = xmlhttp.responseXML; 9 b2 a' B& Z7 V3 ?! E! y$ [2 [2 b
var table = "<tr> <th>Owner</th> <th>User</th></tr>" k9 W" T+ r. a- q
var content = document.getElementById('demo');
! v ^/ j, Z8 B3 B* {* L var x = xmlDoc.getElementsByTagName('TRACK');+ f6 {* l7 a; R8 ~9 R$ g
for (i = 0; i <x.length; i++) { 1 N; r& o+ p% S! c) e* a0 p, A
table += "<tr onclick='displayMUSIC(" + i + ")'><td>";
. X0 ^( }, m( |# G4 ?7 P1 V0 g table += x.getElementsByTagName("ARTIST")[0].childNodes[0].nodeValue;
- j" p d8 n y- Z table += "</td><td>";, R; ]' o) u7 L2 T
table += x.getElementsByTagName("TITLE")[0].childNodes[0].nodeValue;
( J! H5 Y4 k& y; P4 F1 R& i* g table += "</td></tr>";
: c% k) G* a2 H}" t% @( X6 K& B) l" ~5 D
& {2 @1 V& A1 S# P! Q$ O' }& kdocument.getElementById("demo").innerHTML = table;. H4 v, L J( O1 \5 e7 g2 C5 W
var i = 0; R+ e3 i8 G/ n
function next() {
8 C- x0 @6 q2 l% J" X // 显示下一首歌曲,除非已到达最后一首. _% [# x" }; u# s/ @
if (i < x.length - 1) {
( l" E; O2 I9 O; ]* f" |( W1 O i++;
" w: b! x% Y- o& Q8 u3 S displayMUSIC(i);
E k( C6 |" p* L8 b4 k7 N }( H& G8 E- v' M/ F, ^
}
: j2 p- o2 B9 x$ e$ t4 d* D) |( u, A, Q) S3 k
function previous() {
8 L$ L3 r z. B4 I // 显示上一首歌曲,除非已到达第一首
4 u" t9 B& u7 W: u K8 ` if (i > 0) {
; V& @6 R$ e6 H: s q* ?* o i--;, G2 E0 M* `- y8 K$ U/ E/ Z
displayMUSIC(i);
; ^1 }4 T( O0 O0 v4 Q$ d: z }
' s* q: H1 s$ B4 A' g4 N# g }( v+ \ P. y1 F$ S
5 x3 d/ x) j5 c/ U7 \5 w1 H$ A4 } function displayMUSIC(i) {
& Y* ~4 j4 U9 z/ C2 Y document.getElementById("showMUSIC").innerHTML =) g1 I; H0 F) Q' b9 } Y* q. f5 T
"<ul>" +
N: G6 b* m6 s. t9 V "<li>曲目:" +3 a1 H0 s) t" b3 \8 F! r9 C- P2 z
x.getElementsByTagName("TITLE")[0].childNodes[0].nodeValue + "</li>" +
/ K3 y( ?. G$ G9 W6 O3 N "<li>艺术家:" +( @5 I4 p: p6 @) V
x.getElementsByTagName("ARTIST")[0].childNodes[0].nodeValue + "</li>" +$ t4 i$ A1 ?( s$ g8 X/ N
"<li>专辑:" +; e6 Q& ~3 W: J# c0 B5 {7 p8 V/ A
x.getElementsByTagName("ALBUM")[0].childNodes[0].nodeValue + "</li>" +2 b' e. [6 E2 {. _+ C$ P/ b
"<li>国家:" +0 l' k+ ~/ Z% l0 I6 s2 y
x.getElementsByTagName("COUNTRY")[0].childNodes[0].nodeValue + "</li>" + L5 A* o/ G: \4 }
"<li>公司:" +
9 S: E5 x- _- l: R; R x.getElementsByTagName("COMPANY")[0].childNodes[0].nodeValue + "</li>" +% Q/ ^) {: k; A8 N
"<li>年份:" +5 ?5 c* V0 g+ z. E9 `& S3 d
x.getElementsByTagName("YEAR")[0].childNodes[0].nodeValue + "</li>" +4 O# L+ U4 t% U, o9 Q( t2 R7 D
"</ul>";
+ N) }' M5 D7 |2 e5 G; j }
2 z5 ^( G3 F# h9 v" K0 h! c/ S
& G7 `* a4 `( u: a: e( X+ N function loadDoc() {& |7 i7 z7 o+ Z, Q4 I5 l8 T
6 c: a! V, v/ b* w
document.getElementById("demo").innerHTML = table;
0 i/ F8 r4 W8 i }0 a: `! b. E) s/ q# B, t0 n
+ g. Y& K- b; h1 E2 z
</script>. ^: Y4 t( n# B4 i1 C+ t& N* o0 a
1 k* x. H/ N3 E
4 o1 y3 ], Y. \8 q9 t' s, S' H, y6 P- A</body>
7 m8 H3 v2 [ `
, H2 y e# W$ P5 G9 i2 g</html>4 V. W) D, |, h$ c
0 E4 H; Q$ l @9 m: d
5 l3 i5 a) x) Y$ Z
[/mw_shl_code]+ L7 c# g$ ^+ v5 J0 K. i1 G
) a3 b; M5 m$ B4 _9 R g( ?# L1 @+ N7 Z6 Z1 x! t5 {6 O. L* b
: P# ~$ d- G9 ]( a% Y+ AXML文件. ~$ _7 p% e( O1 m/ R; j
9 n H/ t6 a0 v
[mw_shl_code=xml,true]<?xml version="1.0" encoding="utf-8"?>
, }; _1 N6 v& ~. _' s0 J5 M<CATALOG>
' ^- q/ H8 T9 _( T<TRACK>- |% W" T3 o& T7 X& F- {( r+ u0 K
<TITLE>再见</TITLE>
0 X' ?( _# |5 a" Y<ARTIST>邓紫棋</ARTIST>
" u q' X1 y ]( S7 o<ALBUM>新的心跳</ALBUM>
4 M. {1 C6 {. T T, I<COUNTRY>中国</COUNTRY>, s$ F) U0 M& T' k( [8 h6 T" a. {
<COMPANY>邓紫棋工作室</COMPANY>9 |% r+ p& U3 ? h
<YEAR>2016</YEAR>
5 }1 g' h$ c; _( t5 j/ q3 z4 L</TRACK># T9 J; S ]- s. U# o& n
1 ^* E. c6 H) R2 C) s/ u' X
<TRACK>
. Q |. }+ d1 } e7 d<TITLE>All I Ask</TITLE>
; U) _, k$ o: z5 ?2 q' d) n<ARTIST>Adele</ARTIST>
+ r% ^; x% }5 Y: s4 w<ALBUM>25</ALBUM>
B% S* p. ~$ _9 u6 P<COUNTRY>英国</COUNTRY>
9 h) a+ i) u) I0 }1 M<COMPANY>XL Recordings</COMPANY>
) Q& _2 n7 V& ~) { F9 l- v<YEAR>2015</YEAR>
( }$ b `, j6 R( S</TRACK>
$ x+ H* h5 { ?6 U% v, c2 Z
+ R! i, |; c3 I. p<TRACK>
9 y; ~% M. e" J+ A X8 H<TITLE>之乎者也</TITLE>
/ U# U* K# P b$ \, }- Z6 _<ARTIST>罗大佑</ARTIST>. Z8 }) X1 V7 r
<ALBUM>青春舞曲</ALBUM>
7 V0 z7 ?& V+ E @' i. _4 d5 W" W<COUNTRY>中国</COUNTRY>
6 L% Q. m% a$ r9 Q1 Z& z f<COMPANY>滚石唱片</COMPANY>
+ y- [; g% V. G( R8 Z0 f3 a<YEAR>1982</YEAR># g+ M# Q1 Z- Q
</TRACK>
7 E/ Y* k: M5 _0 V, J8 A* n. M2 r8 n: d9 N! B: [' K" w
<TRACK>+ u8 f# ?( K* R$ q0 t* a7 t5 P
<TITLE>Never Be Alone</TITLE>: }; G$ [" x9 ~1 T
<ARTIST>Shawn Mendes</ARTIST>! v+ J5 H7 L2 `- W W* f0 D
<ALBUM>Handwritten</ALBUM>
' C, }* K, a# [; S9 ]6 d<COUNTRY>加拿大</COUNTRY>
# M6 W7 V! c/ Z1 b8 ?! F* o1 [- D* i<COMPANY>环球唱片</COMPANY>
* q& [1 i( c. e% n<YEAR>2015</YEAR>* a- Y8 m% M3 j9 [8 F
</TRACK>! t! e8 Y8 M! T+ a, x9 R$ R$ Y
% X- R( k3 Y" g; J8 D<TRACK>
+ V ~/ j0 j7 Y9 F9 O$ `<TITLE>慢慢</TITLE>
2 s' x$ H7 C4 ?7 y<ARTIST>张学友</ARTIST>
9 l7 O% a! e$ N& x+ s% m<ALBUM>忘记你我做不到</ALBUM>+ X/ \6 ^ s4 J$ A- n
<COUNTRY>中国</COUNTRY>
' u5 R3 Q j8 t- |7 I/ S<COMPANY>环球唱片</COMPANY>' U& w2 w0 r8 q+ ~( {" w# D0 s
<YEAR>1996</YEAR>! m0 S8 K+ ]2 F! J
</TRACK>- ^( X9 P8 G6 C% c0 {" M0 e) F
9 K, G9 v0 x. c5 i<TRACK>
8 W8 u- x1 W+ S% g$ ?6 L<TITLE>Complicated</TITLE>7 w5 l( n T- u; M% N/ d
<ARTIST>Avril Lavigne</ARTIST>
+ t, g2 E' u3 o/ t3 x+ J* M' |; C<ALBUM>Let Go</ALBUM>( z5 _9 R, q% v
<COUNTRY>加拿大</COUNTRY>
! Q6 p9 G* Z, j5 d0 \<COMPANY>索尼音乐</COMPANY>9 X' [; s5 n% Q" s; G" Y0 T' j
<YEAR>2002</YEAR>4 }" V% i+ \( S) r0 z( S
</TRACK>
4 h7 ^7 E, b$ ?! W; P, w) m- Z$ ~4 o+ ?+ a. z9 r+ p4 W, O, a, v
<TRACK>
^2 \% c- J5 ^5 B" ^6 ?: Q, U<TITLE>三生三世</TITLE>' y8 E5 u# X9 V" Q0 I! Q' S
<ARTIST>张杰</ARTIST>
8 B* G5 q1 P& k( O! c; _& |<ALBUM>三生三世十里桃花</ALBUM>9 t% x% o' v" c7 W% O
<COUNTRY>中国</COUNTRY>
/ T+ ^0 b% p, b ]( B<COMPANY>仁溪音乐</COMPANY>, F6 ^- W3 P! J# j1 [' ^
<YEAR>2018</YEAR>+ F0 \# d$ U( y( l% m2 p7 T
</TRACK>
% M6 w9 ?) _# I/ w2 d2 A1 i. R0 }. e: U% p* ]: {5 ^% T1 N
<TRACK> y2 E1 s3 n5 h" ?
<TITLE>Five Hundred Miles</TITLE>
" _; g2 @! u0 `( k* I+ b<ARTIST>Justin Timberlake</ARTIST>
1 R$ A' z( e0 R, L6 z4 M<ALBUM>Inside Llewyn Davis</ALBUM>4 F) W" D0 `% ?. h o" _
<COUNTRY>美国</COUNTRY>% E( r6 o% K* D; Z3 T& T$ R
<COMPANY>华纳唱片</COMPANY>2 S5 C. ?9 C6 n3 j/ C5 @
<YEAR>2013</YEAR>
. O( a7 E, R) {' T3 V& ~</TRACK>: x. S& R7 O; q( V3 ?8 R
! P ~) Z5 L2 G, m9 t' ^; t% n<TRACK>+ g) M9 g2 x# p. p
<TITLE>演员</TITLE>( ^: U* B8 D; T. n1 ?3 r- h1 k
<ARTIST>薛之谦</ARTIST>
) \1 |5 x# Y" E<ALBUM>绅士</ALBUM>. n0 B) h0 [" o3 n: O
<COUNTRY>中国</COUNTRY>
2 y ?' C8 S- i5 _+ n<COMPANY>海蝶音乐</COMPANY> C, Q5 R, @/ C- r: C
<YEAR>2016</YEAR>% \ M% O3 O, N$ S! F0 y P- e3 R
</TRACK>+ f; C2 z; P. Q6 W0 Z
( V8 \/ p. P0 \& l+ m. P" C<TRACK>. D8 E# d: n4 T% H3 F
<TITLE>Numb</TITLE>/ k* k1 i" i8 B8 c4 i
<ARTIST>Linkin Park</ARTIST>7 s4 H% I7 N+ {+ w
<ALBUM>Meteora</ALBUM>- O3 ?- t/ F+ W1 X5 N6 y
<COUNTRY>美国</COUNTRY>. F7 e2 H2 K# Y2 `( o- f
<COMPANY>华纳唱片</COMPANY>5 O0 \ ~9 V1 d# m3 J
<YEAR>2003</YEAR>
* r" m( c. R+ o) K/ _</TRACK>7 \- ^) N( `6 T! G. F
+ M) k2 U# ~7 F% f# [4 {<TRACK>
6 [5 W* u7 s' r `: n' n<TITLE>给未来的自己</TITLE>5 c* i9 v% q: R; s" l! `4 C
<ARTIST>梁静茹</ARTIST>/ S& G, h& e5 R# k, w( X
<ALBUM>崇拜</ALBUM>6 Q4 }% i+ z, j
<COUNTRY>马来西亚</COUNTRY>
0 z+ O. h6 f6 m' {<COMPANY>相信音乐</COMPANY>; B! M, v) d* X# c
<YEAR>2007</YEAR> H$ ^: k7 r. r% M1 q
</TRACK>0 d" C2 x8 T1 [- e
6 P5 U5 n' i: n0 J2 V<TRACK>
+ |' R, }: s5 X; L* |8 a<TITLE>The Monster</TITLE>
0 Q- c3 ^5 Y. ?9 K& [( v. o<ARTIST>Rihanna</ARTIST>
1 s% h2 ~ N4 L2 r; i8 E, Z<ALBUM>The Marshall Mathers LP2</ALBUM>4 j* M, y8 J/ Q2 ^
<COUNTRY>巴巴多斯</COUNTRY>
) I& Z1 S: b5 |1 ~7 p0 X<COMPANY>环球唱片</COMPANY>2 J7 J) A) Z# D' p. W' {) r1 R& G
<YEAR>2013</YEAR>
8 O! ~' q: j' ]! `4 f- W; J</TRACK>
; z5 x5 C6 L0 O8 v- a8 F5 o% l2 S( t% s$ F
<TRACK>
5 i! }0 S) z2 Q) q }3 V$ E7 ~( D7 m<TITLE>我终于失去了你</TITLE>
- _: @6 w; s# S' |5 S% g% e<ARTIST>赵传</ARTIST>
' |3 P8 n1 s' R' E<ALBUM>我终于失去了你</ALBUM>& S [ a/ i3 t K( @: R
<COUNTRY>中国</COUNTRY>
& D0 b4 H3 g2 H# ~) ?<COMPANY>滚石唱片</COMPANY>/ a6 ]4 u+ H" K
<YEAR>1989</YEAR>3 ?1 m& F* i( X, P
</TRACK>
8 Z; O+ C; e3 U3 \
2 A+ i+ U) t* n1 g<TRACK>6 U3 B: e2 t5 @. K9 o
<TITLE>Main Titles</TITLE>
5 T$ X0 M* l& L2 z; [<ARTIST>Ramin Djawadi</ARTIST>7 v$ }- r+ z% c
<ALBUM>Game of Thrones</ALBUM>
" q" @+ m7 w4 f$ f1 R<COUNTRY>德国</COUNTRY>6 H* S3 _5 S( N8 z5 P
<COMPANY>索尼音乐</COMPANY>
& T" Q f8 X9 F; Y% A9 R<YEAR>2011</YEAR>
" R& }- k4 b; Y6 w</TRACK>7 W" I9 N' [/ M; i0 L0 A) p
( @ p7 n/ J, _/ J. D2 o/ R
<TRACK>
! i) F( W3 Q2 I; {<TITLE>传奇</TITLE># T$ V4 J4 m; N1 m! n4 C9 a
<ARTIST>李健</ARTIST>
% G$ \- I& Z9 Q7 V7 |( T5 h<ALBUM>似水流年</ALBUM>) g: E" m9 E& g
<COUNTRY>中国</COUNTRY>) j9 @9 w3 C4 b4 Q+ F! a1 ~
<COMPANY>北京完美坚持文化艺术工作室</COMPANY>
j. s2 _ r( C/ O<YEAR>2003</YEAR>
7 t1 R: F: v' C0 [8 r; P; a# `</TRACK>
. J$ Y$ {7 F0 P6 p% n
& }: }9 i. M- t E<TRACK>
4 f( p( c9 Q7 k! A+ \<TITLE>完美生活</TITLE>+ _; f0 z8 c E, U6 R* j/ N
<ARTIST>许巍</ARTIST>
4 P. v( U( p/ ]" ]' W0 t<ALBUM>时光漫步</ALBUM>" X4 |1 A/ Y* k
<COUNTRY>中国</COUNTRY>
' d( M$ z9 }' o) T1 d5 a<COMPANY>金牌大风</COMPANY>% l ^8 G0 ]. [* Q
<YEAR>2002</YEAR>
! k( y7 Q/ |8 h. |; a, R</TRACK>
; H1 y) G9 Z; \</CATALOG>[/mw_shl_code]
) u: A- }3 T# m* U. N5 A4 d% X |
|