|
请使用QQ关联注册PLM之家,学习更多关于内容,更多精彩原创视频供你学习!
您需要 登录 才可以下载或查看,没有账号?注册
x
: |! ^: a7 B- b% g0 f
, P% K& C) w3 F
5 a9 s1 a3 L/ ][mw_shl_code=html,true]& R+ w) y4 t( V; C* ?. k: G
, o3 x- |. L8 p& y8 h% Y3 Y4 E
<!DOCTYPE html>) y1 J& g9 y1 t& ?% i7 y3 x
<html>4 { y6 E' i- j% V5 F% ]
<header>
1 Y9 X. C9 k3 S! b2 H" H <style>
+ b$ y" E9 T( [6 A4 x9 R$ w table,
) C' [6 g+ e8 p tr,
+ h/ Z7 k, Y8 j' n2 i/ ~ th,
8 o/ G/ q7 T2 l7 v7 Q6 |9 s4 H td {, r0 E5 j) z9 \
border: 2px solid rgb(20, 59, 230);5 H$ ]/ s1 m( Y- h0 M
border-collapse: collapse;
3 V1 c' }3 @$ h; U/ h4 B- s text-align: center;
: r8 Q4 R1 p0 @ }5 e- [; C8 H. J: |" @7 {% L8 {' ?
8 q+ J, \: i! ~/ o& O5 z. P
th,
) N9 |6 ?7 J: j& ` td {
0 B: }5 j8 R5 ?% @$ H padding: 5px;6 W+ K* Q& l/ S" v+ W
}' C4 o7 O8 [" L$ u9 Y l3 E5 X
</style>
; {9 q4 ^6 n- y</header>
; T" F& ~ m1 M7 G. b/ }4 L: ^5 W9 t B+ j, q9 \
<body>$ v! Z0 u# v7 t/ W9 t
<h1>xml http request object</h1>2 W. S3 I5 \$ C
<button type="button">Display Music</button>
- H0 d3 ~8 d* F1 w ` <button type="button">Previous</button>' s3 a: d& M/ t) L. w
<button type="button">Next</button>' Q& \+ b% c# M" j" C; O
<button type="button">get my music list</button>
/ S) t( K2 p9 G! F+ \+ z1 s3 W <table id="showMUSIC"></table>+ a0 @9 r( X; j9 Y( b& `9 g
<table id="demo"></table>
& _6 v( r- j) r: u. c <script>
. E3 x* n1 _6 Q5 U
- P, w7 I9 C: r! t+ H) E var x, xmlhttp, xmlDoc;4 T3 J' L% t! S# K! R9 }/ w7 {3 h
) c( W# Q0 B3 h C( t. K! T% i& g# l4 b xmlhttp = new XMLHttpRequest();
/ j9 c5 Y Q: S xmlhttp.open("GET", "/files/music_list.xml", false);! m/ g+ q& A* e# t- a& Q9 d1 T
xmlhttp.send();: `2 ?- j6 g5 B6 _ t
8 q3 V! w5 e" P. a
xmlDoc = xmlhttp.responseXML; 4 O1 u2 v9 F/ S
var table = "<tr> <th>Owner</th> <th>User</th></tr>"3 }: ]1 _6 b5 P! O$ M' N
var content = document.getElementById('demo');% a" u6 z# P) v$ S" t
var x = xmlDoc.getElementsByTagName('TRACK');8 P0 w& g' ^* v$ X" E
for (i = 0; i <x.length; i++) {
8 a9 Z3 h. R: S1 [& w table += "<tr onclick='displayMUSIC(" + i + ")'><td>";* L6 T( _5 `/ ^0 M, b- [: [
table += x.getElementsByTagName("ARTIST")[0].childNodes[0].nodeValue;
/ S" H6 L; ~! `, t$ M table += "</td><td>";
0 n5 T1 p0 Z$ f1 s table += x.getElementsByTagName("TITLE")[0].childNodes[0].nodeValue;
+ U% u1 W* k1 d1 |! I table += "</td></tr>";. W5 X& X, y, z. K
}( X! ?$ P/ b6 F! v& a
! \$ G2 `2 K3 C/ l
document.getElementById("demo").innerHTML = table;* e$ t) B2 `' G1 V1 a
var i = 0;3 X6 d( u* |3 A
function next() {
" T- a/ S8 `% _8 @) ? // 显示下一首歌曲,除非已到达最后一首5 K( T* ~/ u8 R
if (i < x.length - 1) {
5 i% [. Q* Q, c; h, {: [/ T3 c3 Z i++;
; b. z6 g0 c1 }) I4 v2 O5 N/ @) V displayMUSIC(i);5 V: Y8 e3 ^: a: T- [6 w' n1 j
}+ \0 B# L) {7 P5 N: Z7 S$ E# I. s
}
: V1 E% G$ C! x$ b1 r- m* b! K
. R5 K+ @& P- Q1 L function previous() {
( B% }1 z6 F4 b9 e! w# i // 显示上一首歌曲,除非已到达第一首4 W4 R! R- y8 C Y: o D
if (i > 0) {+ g) ^+ @( B* p2 D/ M
i--;& C9 V( Y5 B A# D+ Z
displayMUSIC(i);4 K& S0 q; @9 A
}. w) Q+ Y* r+ P% k, \2 t% y3 m
}
! s0 f7 h7 q- ^8 X$ E0 J# t! r9 X; T/ ?9 c/ {; {2 h" U
function displayMUSIC(i) {
' ?* k- I/ s/ o2 U' |" | document.getElementById("showMUSIC").innerHTML =1 @; y o$ q- g" M
"<ul>" +
5 ?: `+ F6 o' d "<li>曲目:" +# w6 Q* P' P+ P
x.getElementsByTagName("TITLE")[0].childNodes[0].nodeValue + "</li>" +6 n' `4 W6 ?5 C. H
"<li>艺术家:" +
, ^$ O6 I: _1 s x.getElementsByTagName("ARTIST")[0].childNodes[0].nodeValue + "</li>" +' W! j9 N" B0 Y. ^* \
"<li>专辑:" +8 j8 S" U% \' F4 k$ c8 f1 i
x.getElementsByTagName("ALBUM")[0].childNodes[0].nodeValue + "</li>" +
! l# n1 h( T! l' w "<li>国家:" +
, \5 e. G1 v8 z9 k3 R: I i* } x.getElementsByTagName("COUNTRY")[0].childNodes[0].nodeValue + "</li>" +; M5 P+ g0 N2 V7 Z
"<li>公司:" +% }, m" j _2 C" Z5 [
x.getElementsByTagName("COMPANY")[0].childNodes[0].nodeValue + "</li>" +& S% }0 a+ D6 m% o
"<li>年份:" +7 D. i5 o# p# X" o) Y. c/ b2 a
x.getElementsByTagName("YEAR")[0].childNodes[0].nodeValue + "</li>" +6 s y8 Q! C3 \8 q9 Q# i1 c
"</ul>";
H' p4 \& t2 @8 t0 | }
. ]. V3 Z: C5 S! P
8 h; b7 _0 w8 f- K3 D% d9 B; T' c function loadDoc() {" m5 x" b6 g7 d, q. m+ K2 l, B- T
. Q+ J7 ?) D C
document.getElementById("demo").innerHTML = table;0 H/ D/ `9 l# ?5 {
}1 {! v7 ?5 ~+ {$ d; p
2 ^% M$ ]6 ?5 k0 @
</script>! o. s8 N8 @: h7 G
) ~5 n8 E) ~+ `( b, n4 @) ~
* N8 ]1 C9 h6 J7 }! O0 G) [
</body>
2 X9 ?4 Q& F9 O$ y, ^9 l" w
- p9 }# z# [. R3 l2 j</html>$ [9 k. |3 A: u1 U3 c
/ R/ J" B+ b( H' y! V
9 x! z p; F( N# _" w" C
[/mw_shl_code]$ N1 o1 R. |/ v
9 f% t( j5 M0 w7 f7 I7 ?2 B( ]. E* s! g& l
8 T( q7 A' J! rXML文件
/ r- @0 r* {( Y* a0 a* I. M
- r$ m, x7 }$ F8 `[mw_shl_code=xml,true]<?xml version="1.0" encoding="utf-8"?>6 ^0 B% z9 L) ^+ T
<CATALOG>
( G% [/ n/ G0 u1 R/ U4 J& E<TRACK># N1 ?# n* y# W" {2 Y: F
<TITLE>再见</TITLE>
, a9 i0 q# _/ G& l<ARTIST>邓紫棋</ARTIST>
# Y( M( x' t5 \2 N2 P$ X+ |<ALBUM>新的心跳</ALBUM># q1 d5 K2 Q- q% \5 v$ D
<COUNTRY>中国</COUNTRY> v5 }; U2 n* E7 p Y
<COMPANY>邓紫棋工作室</COMPANY>/ P% C4 W2 F* M; u' h
<YEAR>2016</YEAR>
! J# M# H( X% `8 y. e' [9 u1 K</TRACK>
1 g; }$ X) l0 D1 T9 M# J: K/ [( Y; l) P' [
<TRACK>
, Z1 I* P7 ]. y! ]<TITLE>All I Ask</TITLE>
; p% _5 s* H( y5 ^<ARTIST>Adele</ARTIST># ~( `9 U0 ?: I; l/ ]. g) s* d
<ALBUM>25</ALBUM>
5 C; _8 F2 r. B9 M3 S3 @+ t/ Y0 e1 I<COUNTRY>英国</COUNTRY>
7 m* F8 A; A0 Q# ~$ P+ Y<COMPANY>XL Recordings</COMPANY>
# e: T/ J$ v' u' q ?# g0 k7 B<YEAR>2015</YEAR>9 c: J0 @4 O+ V9 ?0 o. [, H$ @( i
</TRACK>! U9 t, L# O( V7 {6 Y; i
* ?' u5 p. ]% j6 T4 a<TRACK>8 h' K2 D( o- ^7 u$ h
<TITLE>之乎者也</TITLE>
. l/ m% X7 x s3 M6 {+ {: S<ARTIST>罗大佑</ARTIST>7 S& w8 p' M/ H# M, f& v
<ALBUM>青春舞曲</ALBUM># d/ a. l: C. t6 R7 R
<COUNTRY>中国</COUNTRY>
% H( A0 P" K3 b0 _<COMPANY>滚石唱片</COMPANY>( v, e' H( Q/ n& w& _1 L
<YEAR>1982</YEAR>. s4 `1 R! F0 u! L
</TRACK> F3 q/ F) Z r3 U% P* Q
, x- j: j/ M4 K- M- G
<TRACK>
- E3 N9 ?, {3 h+ Z% w<TITLE>Never Be Alone</TITLE>% Z! s/ F- H9 o9 \8 f
<ARTIST>Shawn Mendes</ARTIST>
: O& @0 R1 u: j6 b, B, o<ALBUM>Handwritten</ALBUM>
2 y2 L- Y. u% V3 a& P<COUNTRY>加拿大</COUNTRY>
: V) R8 U L# _4 ~<COMPANY>环球唱片</COMPANY>9 r) d. T- V1 `& c# O4 N
<YEAR>2015</YEAR>
V4 [1 x) l7 m, i3 E! c7 S</TRACK>
' y6 k* ] z# Y7 Q
8 `4 f9 u9 J: {' ]+ G9 V<TRACK>
% A1 L9 R, N# \% t, j. u2 s<TITLE>慢慢</TITLE>
2 c) b `1 R# P+ Y4 B- u3 N<ARTIST>张学友</ARTIST>
! `0 p: o$ F3 x* o+ u<ALBUM>忘记你我做不到</ALBUM>
0 A0 i; ~0 L) j9 l" h4 z) H- X: u<COUNTRY>中国</COUNTRY>
) L: B2 v+ |$ X<COMPANY>环球唱片</COMPANY>
8 o7 R* C% n0 K* I4 [7 V<YEAR>1996</YEAR>7 m. R1 O0 t, J* R1 w6 h2 q' G2 C1 o
</TRACK>7 D4 s: b1 o' e- w* J$ r: F
* N) Z# p4 v! X0 N: \<TRACK>5 j, \& t8 B b0 U
<TITLE>Complicated</TITLE>
- M. o$ o1 |" E1 B4 X/ ]<ARTIST>Avril Lavigne</ARTIST>! \$ R3 ]$ u6 _6 i" E
<ALBUM>Let Go</ALBUM>
' n: R/ w& x4 ~' j# i8 `5 T<COUNTRY>加拿大</COUNTRY># @+ r$ x& V# x: ?
<COMPANY>索尼音乐</COMPANY>
7 h$ [4 n/ A: ~ A<YEAR>2002</YEAR>/ O' F6 n9 Z% b5 t- d% \+ Y
</TRACK>
4 L; _- c$ T. ~8 w8 |0 K$ g
, `3 O8 I5 E6 _5 g2 } A1 z<TRACK>
1 R& q7 [7 }% |+ C* w# C7 l<TITLE>三生三世</TITLE>% W6 ?- _1 C! v9 S; z
<ARTIST>张杰</ARTIST>/ G8 o4 G. V7 c5 X9 \9 i; T- D
<ALBUM>三生三世十里桃花</ALBUM>
2 g) E4 r/ v6 ]: t<COUNTRY>中国</COUNTRY>
6 K1 V8 R6 Y+ d8 B% `% A$ F<COMPANY>仁溪音乐</COMPANY>2 C' d1 g' R; J/ q
<YEAR>2018</YEAR>% o% S ^# g1 t3 D& a
</TRACK>7 i1 U4 G3 Y+ m5 a. |9 N7 t, ?1 {! j
5 l. D" ^' g; T. ?! Y; X2 g/ u* O<TRACK>
& f8 \9 `% z0 b<TITLE>Five Hundred Miles</TITLE>4 O) c: r) c$ m3 ^; E& K+ L/ P
<ARTIST>Justin Timberlake</ARTIST>
9 @: {7 z9 X* r. S- C5 K; S<ALBUM>Inside Llewyn Davis</ALBUM>/ e3 D6 w6 `1 z
<COUNTRY>美国</COUNTRY>
4 _' B7 @& G3 x<COMPANY>华纳唱片</COMPANY>
% N9 ^ N2 U$ w$ M" v) K) w8 q5 X<YEAR>2013</YEAR>
E- ^1 `) T) @: v) R3 }</TRACK>
% [% [6 P4 x8 l0 L
4 X, A$ T, u6 r M<TRACK>( q7 s: n' V6 I4 ~$ t, T3 e/ x$ d! `
<TITLE>演员</TITLE>
' Z& {# A1 q4 k8 E+ G: v2 D<ARTIST>薛之谦</ARTIST>
2 H: c; }# L+ s3 p7 A9 Y/ c<ALBUM>绅士</ALBUM>4 r" { }- I5 e6 V5 J z5 o) L, A
<COUNTRY>中国</COUNTRY>9 D, Z, q, I8 L3 \6 a. p
<COMPANY>海蝶音乐</COMPANY>
) F9 W* B* n h$ N+ F<YEAR>2016</YEAR>$ t7 M* I! M9 W: S# y3 W0 ]& @
</TRACK>
2 f7 d* L4 F/ B) B9 n( A# o ~% T1 G6 Q* K: W( u! k9 F
<TRACK>
" j) v4 G' y! o2 A4 B<TITLE>Numb</TITLE>
5 B& l* X; O& \* H/ x9 T2 ] C0 O<ARTIST>Linkin Park</ARTIST>7 I' Z+ H7 r1 c- q' c6 @) o
<ALBUM>Meteora</ALBUM>0 I2 x9 P3 V% Z( q% a: G
<COUNTRY>美国</COUNTRY>8 F3 v/ Z8 w% m
<COMPANY>华纳唱片</COMPANY>
/ Z4 P1 w. X T5 N! t- w<YEAR>2003</YEAR>0 ]2 C L; [' y- v. ?: k* R
</TRACK>
9 \. w. ^* }9 L
8 F/ K/ L, b* l" j4 V0 h5 s<TRACK>: \0 Q5 b4 R- l: v8 j4 V) L7 \
<TITLE>给未来的自己</TITLE>8 y( b+ M; g0 a! ]8 K e
<ARTIST>梁静茹</ARTIST>
+ e7 H+ i2 e0 t* F+ |) p<ALBUM>崇拜</ALBUM>4 D- r7 F$ P# p8 D
<COUNTRY>马来西亚</COUNTRY>8 }" @2 ~ q( F. F9 m+ R! @
<COMPANY>相信音乐</COMPANY>6 `! g# P* Q# _1 C. P1 b
<YEAR>2007</YEAR>
/ }: ]! T; N, q9 ^" {4 c$ i</TRACK>8 t6 u) `- g" ]1 @6 D Z, k8 y' u/ G
2 U4 U9 T+ B; d( _- `- S
<TRACK>
: h8 {: _- o" l- `9 w4 k' Y; U# k<TITLE>The Monster</TITLE>
6 r0 \+ e/ S' W<ARTIST>Rihanna</ARTIST>; X( [5 e, r$ m9 x( y* e! ~
<ALBUM>The Marshall Mathers LP2</ALBUM>
' g4 x$ C' ?( _3 x<COUNTRY>巴巴多斯</COUNTRY>
% g7 V7 _! s9 s) o, x i8 ^, ~8 e<COMPANY>环球唱片</COMPANY>7 E( l4 |; i, \) r. J ~5 i9 `1 D5 c
<YEAR>2013</YEAR>3 {0 N( y, H/ B
</TRACK>( x- t" U& w* f8 C% {
- o% M" o9 n% g
<TRACK>
3 F: j+ G% |- b3 [. ?<TITLE>我终于失去了你</TITLE>
8 _: x4 ^) ^$ c/ ^6 D3 q9 B0 a<ARTIST>赵传</ARTIST>
" Y/ G7 m4 j: N; [2 r0 n: U<ALBUM>我终于失去了你</ALBUM>
, G7 Z+ }6 S' N+ o<COUNTRY>中国</COUNTRY>
3 ?$ j5 n. {% K8 d- u3 m" p% }<COMPANY>滚石唱片</COMPANY>; C- j- i4 K! W: `" i* D
<YEAR>1989</YEAR>$ i! H) C( o# m# [
</TRACK>& @: @ L. R O% e2 M
7 A* L3 ^! O, a3 P9 E5 X
<TRACK>! E7 E/ x+ a' L; ?3 g, s
<TITLE>Main Titles</TITLE>
' B( f4 [1 }# Q' ?6 Z$ `<ARTIST>Ramin Djawadi</ARTIST>' ?' b( Z' V7 [$ \
<ALBUM>Game of Thrones</ALBUM>
# |5 `0 F4 x* A1 Y. y3 O* x<COUNTRY>德国</COUNTRY>7 u' C' C. v7 J' U' p1 \: G
<COMPANY>索尼音乐</COMPANY>( Q" }; v& i- L) k$ W8 `
<YEAR>2011</YEAR>; S4 q, G2 O1 P, k! h
</TRACK>
# \# X, g) {) L$ I3 B
; I1 g7 T: W9 X4 o) ^- v/ |<TRACK>1 O- S) \) B9 U6 e" N9 A
<TITLE>传奇</TITLE>& Q9 a. b; ^+ c0 q/ V
<ARTIST>李健</ARTIST>
7 s6 I6 n6 ^& D: n4 _0 d<ALBUM>似水流年</ALBUM>- |% L- S" J. i# A- z( ?
<COUNTRY>中国</COUNTRY>
' M& G2 {' k5 E<COMPANY>北京完美坚持文化艺术工作室</COMPANY>
: g8 z& o+ m' `1 v" J( p<YEAR>2003</YEAR>- W3 p" g+ x# G( N* p% S' i* S
</TRACK> \! J2 m8 @* T P! e
& H5 x' d) S4 H5 ]
<TRACK>5 V, x$ @: Q8 {! x+ H
<TITLE>完美生活</TITLE>: }2 y. ~' I2 T
<ARTIST>许巍</ARTIST>
2 T. F7 b4 b+ W& T! h" L<ALBUM>时光漫步</ALBUM>% D1 ]6 A3 d7 a& ?2 ~' V
<COUNTRY>中国</COUNTRY>
* ^; ~" d6 |( `; _# O' m7 z<COMPANY>金牌大风</COMPANY>
4 k* _3 K- I b' f5 F5 V7 Q' O<YEAR>2002</YEAR>
: o' z: y6 }# _2 W# P# b</TRACK>4 g: K/ j0 d! o" \' N
</CATALOG>[/mw_shl_code]4 n7 K$ \" I8 l
|
|