|
请使用QQ关联注册PLM之家,学习更多关于内容,更多精彩原创视频供你学习!
您需要 登录 才可以下载或查看,没有账号?注册
x
; F% p! ^( w* z" g$ z
# \, q, d Q4 g- Y# \; {: g4 c# ]0 }
[mw_shl_code=html,true]
9 P# w S8 N& B: i
/ @$ g( y# n. A" x9 V# ]6 w+ P. j<!DOCTYPE html>: i7 T# W/ q; X0 l* I7 t
<html>
: E/ ~* H0 e; V; _7 Q+ u; ~0 Q, T<header>
! V ?6 Z) f& @: b4 s <style># O6 Y- c* S0 k3 L! P' s3 O1 }2 E
table,
* W8 C- E. T- f tr,, W; L" t; t* K% r
th,
% ]- ?+ U5 E/ S- _; p td {
( ?8 M. a& y& C border: 2px solid rgb(20, 59, 230);. {8 O* ^0 h" S0 h( L3 C- A
border-collapse: collapse;' c; I) J: C. w3 ]: m; l
text-align: center;
/ p3 v+ ^, i! K7 G W }
* D* |$ I! f* U. D
$ t* V. c3 t/ I# @+ ]. ? th,
+ \/ ?+ k9 \: e- n( R l td {
0 D: k* ~$ q: E% j i2 G padding: 5px;' D8 V0 i k! P/ c
}
2 v& j. r! D6 Q: n$ c$ a3 a5 f </style>
/ ~2 Y; D7 o8 R9 Z" _) X</header>. j1 Y3 H9 B4 m# T
! c: g. S! i: x) `& N* n! C% c
<body>1 d0 p# Y% h1 c, ~
<h1>xml http request object</h1>
' {- {- j- ^- a- S3 J <button type="button">Display Music</button>3 L: ^6 ]3 v1 U+ @6 O9 O( {
<button type="button">Previous</button>6 a6 B% [# y6 E# @. n
<button type="button">Next</button> W/ x9 d. M" F. `/ w- w
<button type="button">get my music list</button>; W; @4 R4 `3 G, k3 n
<table id="showMUSIC"></table>
& X. Z3 y5 ~! D <table id="demo"></table>; m- |: I9 ^/ ]7 `
<script>* L8 k! D6 \ A3 y* B/ w) Y
1 h7 ]9 d$ H% Y2 i var x, xmlhttp, xmlDoc;8 \/ w, l& P+ g; z4 l6 Z$ t, B, j; v, _
1 p; M5 c# u t- I( y( d7 W* V
xmlhttp = new XMLHttpRequest();
' _$ R9 H3 ^: O( r5 n' ?! U xmlhttp.open("GET", "/files/music_list.xml", false);# h4 n+ e+ r7 [1 e
xmlhttp.send();% @/ p4 J$ B, g; C1 ]6 e
! ]' U7 \8 ?( @! g P: S' G xmlDoc = xmlhttp.responseXML; ( ]) J, w2 E6 ~+ [2 ^( V, p/ a
var table = "<tr> <th>Owner</th> <th>User</th></tr>"
# F; v, U7 s7 `! p0 W9 B$ J var content = document.getElementById('demo');
$ u. R, f. @2 L0 p2 U# _7 B: z var x = xmlDoc.getElementsByTagName('TRACK');
4 \# H2 t/ ]- v& C* w, Q for (i = 0; i <x.length; i++) { $ |5 }3 f9 ?: E- [& C
table += "<tr onclick='displayMUSIC(" + i + ")'><td>";
5 t: q& K, k5 x. o# n9 y' a* V table += x.getElementsByTagName("ARTIST")[0].childNodes[0].nodeValue;( j6 N; c/ O7 ]
table += "</td><td>";
- S2 p. J' j" Y table += x.getElementsByTagName("TITLE")[0].childNodes[0].nodeValue;
/ T5 N' r% Y: q/ S, c table += "</td></tr>";) H1 I7 o8 h5 j% x
}
% ?0 h' S" z# E; [9 e9 A! \% ?& j4 P9 v/ Q' Q I( I1 [' e' _
document.getElementById("demo").innerHTML = table;
+ w8 j0 U k! W7 ~' @9 svar i = 0;
, ^5 }& l% ^: _: ] function next() {
+ L# ~& Y! v! v+ O // 显示下一首歌曲,除非已到达最后一首& W) _: G1 ^+ K5 x7 d+ n1 Y
if (i < x.length - 1) {
# P. N4 c. z9 m- w* L+ ~ i++;
; q) m* o5 ?/ X- R5 g i displayMUSIC(i);+ [0 q5 `% |, \/ }4 k! a+ ]2 q, v
}0 o v3 U! V4 s- `; o& p
} K% \2 O) I3 n; K; G2 L
4 P; v8 p5 b8 H
function previous() {7 T2 t8 ~ j) g) w& }9 ^1 [
// 显示上一首歌曲,除非已到达第一首3 y7 M8 [1 o( K7 k& F: J9 W) x8 y
if (i > 0) {9 a( P& z1 g: x7 _9 V" i, v6 O
i--;
) r+ T1 W8 n. k8 \5 t1 @ displayMUSIC(i);
_/ o9 B$ j/ F5 P2 K' F/ \1 X } s# |/ v$ b4 D8 K5 m
}& o7 ]& @; R( X4 w B
, e8 d* U$ J: T" k2 O, z function displayMUSIC(i) {3 M+ m4 I* f8 Q8 L0 t4 x& {& \+ @+ s& w/ v1 A
document.getElementById("showMUSIC").innerHTML =$ a8 O8 u( `& G9 S) M
"<ul>" +
5 X; k. d5 l. j6 i: h5 Y& e' \ "<li>曲目:" +& ^$ t" W/ f; U1 W" H
x.getElementsByTagName("TITLE")[0].childNodes[0].nodeValue + "</li>" +. i+ X4 m2 O; w
"<li>艺术家:" +; Y/ Q) i M: g' _3 L7 [- g
x.getElementsByTagName("ARTIST")[0].childNodes[0].nodeValue + "</li>" +! K, c- Q1 f9 j5 v4 ~: l
"<li>专辑:" +
4 ^1 p2 [& U+ Y9 r, p8 K3 } x.getElementsByTagName("ALBUM")[0].childNodes[0].nodeValue + "</li>" +" m) v' ^. L" P! d& J6 z
"<li>国家:" +7 H3 I8 d3 e4 d
x.getElementsByTagName("COUNTRY")[0].childNodes[0].nodeValue + "</li>" +' f9 [8 }, s% k7 ?- T1 I2 f
"<li>公司:" +
7 }/ z8 Q3 v0 V0 r m1 o x.getElementsByTagName("COMPANY")[0].childNodes[0].nodeValue + "</li>" +( f4 s$ P2 e1 H" M6 z' t: n0 _
"<li>年份:" +
( g0 d7 ~4 n( @( P- p- M: t x.getElementsByTagName("YEAR")[0].childNodes[0].nodeValue + "</li>" +
" j4 n& W4 ^! u, I "</ul>";
8 O2 N7 v5 T/ J% F, `' n }% o1 }& N: n# X. m8 f) V# a
; B1 H e% E# m& Z+ P5 v7 a1 A1 o9 p
function loadDoc() {" X$ \) X* f$ H+ Z: ]9 T
# K. U9 D4 d4 y- s% G. W
document.getElementById("demo").innerHTML = table;' t! |$ M5 G; J3 N7 i
}4 @* r: t; c( b" Y( d0 ]7 m
( y. U" e R3 @ </script>) q$ r' Y/ x$ K1 Y& h3 U7 w9 [0 `
, t- e) G$ p! u6 i
4 C- F5 h5 R9 N</body>
1 N e$ b8 c3 j0 v9 ^- M$ f) H4 d1 v$ }! i
</html>
, ? N( _' z1 Q6 @. w1 Y3 R; ^$ W* X9 U9 V3 ^) G4 c, H
# i9 _+ A) ?5 p( b8 y[/mw_shl_code]
; v5 x1 W1 V, d6 U
5 {7 P" y8 \: A3 C
( U; n" D+ t- f
) B) p! ? G7 O1 ?: h3 K" C+ L, E( hXML文件! o# n6 s9 m! @. q& [$ q
; B _7 V2 N' M# f9 e0 P F- H5 r1 @[mw_shl_code=xml,true]<?xml version="1.0" encoding="utf-8"?>0 i3 s3 L7 o$ c: l$ J: W: ^! f
<CATALOG>
, |; O$ b/ o) R: D4 Y. c<TRACK>
. G/ n: m# Y/ A. X6 d<TITLE>再见</TITLE>
0 |$ ^" J b" ^0 n3 ?) {<ARTIST>邓紫棋</ARTIST>
8 X' \/ [+ T( E! [, l4 k/ {9 F<ALBUM>新的心跳</ALBUM>
3 b0 \. N Y9 b<COUNTRY>中国</COUNTRY>8 n) I1 C# \# U+ `6 c' j" }# K/ w
<COMPANY>邓紫棋工作室</COMPANY>7 X! C5 p2 D* N, y5 U3 x0 a# V
<YEAR>2016</YEAR>
5 v0 O! V/ P M P) B$ h</TRACK>
# Z9 f+ [& c! e/ X* D. a
% ~4 _8 h& F" w ^<TRACK>+ z% O/ i/ R3 H* j# s
<TITLE>All I Ask</TITLE>
6 G: Z( l2 F4 F) T( O& Y3 S- T<ARTIST>Adele</ARTIST>( U. T3 L( _; J( A
<ALBUM>25</ALBUM>
$ E2 o# I; y. p8 a5 U0 q<COUNTRY>英国</COUNTRY>' q) f. ]% y7 s: }
<COMPANY>XL Recordings</COMPANY>6 y" b6 K1 S$ f6 ]
<YEAR>2015</YEAR> [0 e0 W/ [# C- v# V& d3 d
</TRACK>
# X' ~5 V% u0 h! l7 F
, a7 y! Z6 g; h- S0 X<TRACK># t& }& |8 h9 `. C& C' B
<TITLE>之乎者也</TITLE>
# f3 o1 S8 }4 L6 e X, u- X<ARTIST>罗大佑</ARTIST> ]' V8 E# X( S: C& \7 H: l
<ALBUM>青春舞曲</ALBUM>; d* b, Y9 }. N- l
<COUNTRY>中国</COUNTRY>
/ l! w4 ~, G# T/ ?; ^+ T5 i: I<COMPANY>滚石唱片</COMPANY>
/ {( J G9 f1 s5 P0 d% |<YEAR>1982</YEAR>" l6 r3 J# u8 \4 C! ~9 l) K& R
</TRACK>
3 g: Z0 ^) M# u& S( V, n! F. i
# I; X' v- x0 k0 a! |<TRACK>: l: L" p$ }/ `
<TITLE>Never Be Alone</TITLE>
* W% ?0 t7 Z4 `; h1 _5 k8 y2 R<ARTIST>Shawn Mendes</ARTIST>
6 i! k: q. P! p/ c k5 ?/ |6 g: \<ALBUM>Handwritten</ALBUM>
4 j* g9 e# r9 e<COUNTRY>加拿大</COUNTRY>
; e* M7 p5 [( u" N, d2 N K<COMPANY>环球唱片</COMPANY>- g1 A0 h, @" E# G
<YEAR>2015</YEAR>6 Y; w+ T( O( b: K
</TRACK>
$ I( R: t% Z+ f# b3 c7 g" [0 Q. ^- Q+ u2 A8 D( K( j
<TRACK>9 r& v* e7 ?/ o4 Z
<TITLE>慢慢</TITLE>
/ p# w1 V. H' x7 q( {4 o<ARTIST>张学友</ARTIST>0 Q5 U; A3 \% M( E
<ALBUM>忘记你我做不到</ALBUM>! c2 f; }$ C! b
<COUNTRY>中国</COUNTRY>2 G6 [, _9 |- K- G. r) X
<COMPANY>环球唱片</COMPANY>
% [( |: o5 @' ]0 D5 |$ A<YEAR>1996</YEAR>
* D' G/ V# x$ K5 K</TRACK>
1 f- j3 U% r9 f8 ~
$ A) `$ Q2 v$ G* \* \ U. a<TRACK>
4 o8 |( U, s2 m7 E4 [<TITLE>Complicated</TITLE>. ]* a3 @- R) i1 H1 v3 [
<ARTIST>Avril Lavigne</ARTIST>/ D- ^; R" S8 V5 j
<ALBUM>Let Go</ALBUM>
5 N% O% @* V# B6 I<COUNTRY>加拿大</COUNTRY>+ h* B3 N2 B# J% ?9 n) p$ T' _1 X+ f
<COMPANY>索尼音乐</COMPANY>
l9 `( l( v% Z4 C<YEAR>2002</YEAR>
! J% t0 E/ M7 x, i1 ~</TRACK>- {" @$ a8 I$ o$ l
* ~ R. @$ s' s a) \<TRACK>1 m, j, x5 }8 x ?( t
<TITLE>三生三世</TITLE>
& j/ \& a# A0 Z. M6 a<ARTIST>张杰</ARTIST>
4 t; @, o3 ]% _0 U9 v$ _8 f% q" _. q<ALBUM>三生三世十里桃花</ALBUM>2 C3 C) z# S" W) a, R, b
<COUNTRY>中国</COUNTRY>7 `& X6 N. y5 E+ j% L! {& w" Q* ]
<COMPANY>仁溪音乐</COMPANY>
8 z. H: ~$ q0 ?% u$ D8 e( g4 D<YEAR>2018</YEAR>
: _' @! k$ J, e/ q Y</TRACK>/ t' r3 d) p- L& a1 W
1 Q7 B; T0 u) ]
<TRACK>
: F7 O$ n* i( O) d J l O<TITLE>Five Hundred Miles</TITLE>3 F( Q3 Q+ ?) P8 u7 v
<ARTIST>Justin Timberlake</ARTIST>5 t, D4 ?) Y: r( B
<ALBUM>Inside Llewyn Davis</ALBUM>2 p2 z5 f/ T( ^
<COUNTRY>美国</COUNTRY>; `( b, @. ~9 X& t
<COMPANY>华纳唱片</COMPANY>
( w* x0 }' r: V* W/ z4 N! J* k0 Z<YEAR>2013</YEAR>7 v9 q( m2 b. V# a5 r3 U/ z
</TRACK>
t1 C" u4 {2 _ T$ W! c9 ? o2 L: k' I5 A3 @* Y5 {
<TRACK> f. h0 R) p+ s" \* G4 i
<TITLE>演员</TITLE>
/ U/ Y$ r. O/ l: p9 M<ARTIST>薛之谦</ARTIST># ~( r/ o- B1 C) V+ B
<ALBUM>绅士</ALBUM>* x4 Q- W8 h) e9 X
<COUNTRY>中国</COUNTRY>
4 R; B! R7 c! B( Y5 W r/ T4 w9 W<COMPANY>海蝶音乐</COMPANY>
, U3 X# [3 `! ]" M0 g! C( x$ s7 B<YEAR>2016</YEAR> d, e3 \' F c- l. Q
</TRACK>
C8 T) o* h' L8 H' V0 H. n5 q
<TRACK>0 _% I) M0 h. ?- Q
<TITLE>Numb</TITLE>
7 l) m$ h+ G8 ]- m<ARTIST>Linkin Park</ARTIST>
" R. _* W0 K- h1 k<ALBUM>Meteora</ALBUM>& h+ K/ O& N; T9 @
<COUNTRY>美国</COUNTRY>
9 E" L1 f9 ^0 @' r" `" A0 K( q<COMPANY>华纳唱片</COMPANY>( u+ Z' N" F a' {5 {
<YEAR>2003</YEAR>
! Z' s% V; @( B</TRACK>/ F) E: d' E8 x' i% k0 l/ ~
& R- X8 W2 B4 _) @- ~
<TRACK>1 i% |0 B7 Z/ b% J0 j2 w
<TITLE>给未来的自己</TITLE>
) ?* M3 @! }( J<ARTIST>梁静茹</ARTIST>, w2 U; C( o( v0 h
<ALBUM>崇拜</ALBUM>
, w/ g, V1 ]: D: z# d6 e) V<COUNTRY>马来西亚</COUNTRY>8 [3 r, e7 a5 |( ~2 V* e6 ~8 o# _( h
<COMPANY>相信音乐</COMPANY>: N! m+ N8 P% a4 N
<YEAR>2007</YEAR> c, X* ?- e# X& s
</TRACK>
& e8 p J: U$ d3 ~8 y- r9 H' d+ ^ t0 Y, F: q, v
<TRACK>
- Q: {# F! w4 z% a# D; Z4 n<TITLE>The Monster</TITLE>1 Z" w% X" b, U6 z8 b8 y3 x9 }
<ARTIST>Rihanna</ARTIST>
0 S3 C+ `0 T% |' H8 l<ALBUM>The Marshall Mathers LP2</ALBUM>
5 x; n/ B$ ~# W+ [! r<COUNTRY>巴巴多斯</COUNTRY>) ~5 Z. J" I1 S, T& k2 \ V* e
<COMPANY>环球唱片</COMPANY>- L5 u4 D# P6 J4 u
<YEAR>2013</YEAR>
# S: x. U/ O- ~3 N7 Q</TRACK># E9 }0 Q& H7 n
& z1 B( m$ X8 V' r. l$ v<TRACK>* @; g! S* W) w: u
<TITLE>我终于失去了你</TITLE>2 d. @, C% W+ ?
<ARTIST>赵传</ARTIST>& I% S y+ r3 M: O3 @
<ALBUM>我终于失去了你</ALBUM>
' P2 V5 ?2 `. S- L* {4 f* x<COUNTRY>中国</COUNTRY>3 @' q7 Z( d/ ?" ~ F
<COMPANY>滚石唱片</COMPANY>
1 b( H/ c9 G% C7 W" H2 \5 N<YEAR>1989</YEAR>
, h6 c" n9 }6 s& o% ^</TRACK>
" N7 T- d' r. |' }
% r4 s, U. H4 G2 f, u f4 y# v4 ]<TRACK>
: I! A( k) H8 q. @" m, f<TITLE>Main Titles</TITLE>1 b- z. g7 v0 S
<ARTIST>Ramin Djawadi</ARTIST>; e, j) m5 z# _5 S5 h
<ALBUM>Game of Thrones</ALBUM>6 o. ~' f! i3 p' s) K
<COUNTRY>德国</COUNTRY>& a, _/ f, f+ h
<COMPANY>索尼音乐</COMPANY>
0 S/ j! }6 _. s4 Q( v. o6 Q<YEAR>2011</YEAR>
$ G6 `" o& o/ D& ]+ J: q" z& f</TRACK>
/ [8 y0 Q1 o8 ]; K( Y! u- c
( N k, s& i: j$ O0 {; s) z* D1 m<TRACK>9 b3 D+ q9 w8 U
<TITLE>传奇</TITLE>
% z0 S( h, ~' E* A<ARTIST>李健</ARTIST>
, G/ l9 R2 ^7 H; ?: H<ALBUM>似水流年</ALBUM>& X \/ b, B" u* F
<COUNTRY>中国</COUNTRY>0 n" i6 O) p, ?/ t- m
<COMPANY>北京完美坚持文化艺术工作室</COMPANY>5 Z9 P% K' H: h
<YEAR>2003</YEAR>3 g1 C, t1 Z7 b# I7 c7 k
</TRACK>( C6 x: r0 N! A" `8 O
6 t4 g/ ~) H. N2 O* U: i' W8 @<TRACK>
- ?- L9 x8 ]: u- E: }& K: s<TITLE>完美生活</TITLE>
3 P: d% e& V- ]) a% U: W<ARTIST>许巍</ARTIST>
' S5 C0 u- v1 H6 G; y( ~: w<ALBUM>时光漫步</ALBUM>* v* c2 E. O3 L8 ]9 P0 A& k* e2 e
<COUNTRY>中国</COUNTRY>
# w3 q' H7 a G! v$ o<COMPANY>金牌大风</COMPANY>4 K7 e9 a6 p. \- p. d/ H
<YEAR>2002</YEAR>
1 w9 ?, i9 C) v9 S; d: ?# _1 c7 E( u</TRACK># ], r4 B: q$ T0 P2 w7 ?* F* b1 T5 @
</CATALOG>[/mw_shl_code]
# v k; W- X. ^0 e( r4 j. }4 A9 Z |
|