|
|
请使用QQ关联注册PLM之家，学习更多关于内容，更多精彩原创视频供你学习！
您需要 登录 才可以下载或查看，没有账号？注册
x
0 S9 w8 U8 B% b: S
0 _& ^2 R/ l E* k- F6 f) ~' |) F
[mw_shl_code=html,true]) V5 M" f, d' u( F) a4 }, {5 V+ e2 N
8 t# N7 c' ]' e. X$ w Z( u9 k
<!DOCTYPE html>
^/ c/ \; `- ^<html>
. b( S+ H& D3 z% q/ O9 ^( j<header>" g% B' E! ~+ Q
<style>; Z2 _/ }, g3 P2 V2 T6 Q* U0 Y
table,+ t1 d* W/ K$ {! T6 K
tr,5 y% S7 {/ A( a; x* W
th,
6 b( g3 D* p7 }/ t O5 v6 C td {# ^1 `# d6 j! @- `) @2 L
border: 2px solid rgb(20, 59, 230);
; h/ J4 Z* t7 |: H, E2 H2 U border-collapse: collapse;' i9 e, K4 }( V: Z
text-align: center;7 K u# d: M3 f1 `: q. I
}( z3 O# N$ ?. E/ z5 [
% d" K2 M4 h: r. h& n1 }3 b th,$ ~% y. C5 U# v) f9 W2 h$ ?" f
td {
* ^$ L, a* q6 Q" F$ v padding: 5px; D2 a1 i2 ^7 F3 @2 T* M
}
! E$ w! g# M8 M* ^& L </style>
# W0 K( C9 R" u0 P7 q0 K) O</header>, {8 T- E( z/ v0 ^# I
" T, \* _# j' ^) O" F<body>
& F3 I/ O! x& ^+ |. ]8 c <h1>xml http request object</h1>
1 i5 `0 G6 h0 Y <button type="button">Display Music</button>9 P: v1 A# f. K) w
<button type="button">Previous</button>3 G& C, w9 p+ X5 P& F' C+ f
<button type="button">Next</button>
. [: _, h. e) ` <button type="button">get my music list</button>' r, T/ a- f; |; h8 j. p
<table id="showMUSIC"></table>) j9 t! `# L; b' x2 A
<table id="demo"></table>* C7 ~6 j% q( s
<script>
# q" M% ^* g# U) x9 ?% j& }
$ }% R; u0 D$ m% h) B- S+ Z+ J9 V var x, xmlhttp, xmlDoc;- M9 D0 c0 U7 `
4 r* m6 H4 T5 }+ @' l. @; _ xmlhttp = new XMLHttpRequest();! M5 Z8 ]1 U" F& I. Y/ k' C: [+ N
xmlhttp.open("GET", "/files/music_list.xml", false);
; Q, x5 F7 f1 I$ c7 F( U7 f xmlhttp.send();
! r& {, Y: D! T! D6 C _
7 I4 f; n1 f, P/ c2 Y' y% ^ xmlDoc = xmlhttp.responseXML;
% X( \6 ]0 j4 G: K2 @9 Y" q5 V var table = "<tr> <th>Owner</th> <th>User</th></tr>": y- T# C% p& Z. j. Z6 D
var content = document.getElementById('demo');
2 J* w3 e( L+ h k& O var x = xmlDoc.getElementsByTagName('TRACK');
% F: c7 ?" E6 t+ N0 N4 F# I' S. p for (i = 0; i <x.length; i++) { : g7 y& o& [+ K; H3 P
table += "<tr onclick='displayMUSIC(" + i + ")'><td>";* T' E* U) b( M% |* w5 M, h' j
table += x.getElementsByTagName("ARTIST")[0].childNodes[0].nodeValue;" ]* `8 t( Z. y) ^
table += "</td><td>";, I+ c/ {/ H6 y1 {2 o; U
table += x.getElementsByTagName("TITLE")[0].childNodes[0].nodeValue;, V, ?3 s4 n) J1 B- g- Q* p8 m
table += "</td></tr>";9 r8 _! ]2 p4 K% y _
}' Y# R% p h- s6 c* m' `5 A! x
0 \$ w) p" b( p* |) Ydocument.getElementById("demo").innerHTML = table;7 u2 ?+ }3 l6 [# S4 c# _# Z- m' Y" V
var i = 0;1 D3 h7 q9 Z& Y( C* v
function next() {8 }9 M/ N+ @+ m/ d
// 显示下一首歌曲，除非已到达最后一首
" { W' s i& c3 P& O# Z2 H. y: E if (i < x.length - 1) {
2 F: e' I: G/ T7 e# Y% X+ E i++; U/ f. y) t% c+ `4 U: v, o: f
displayMUSIC(i);* @9 v, D+ m) q8 x# X+ H/ y# Q
}- M7 l* Z, Z; o' z5 _: z
}. _0 d- }! b4 K( ~, E
8 G4 T# s( {" o6 `7 d t) {, l) v function previous() {2 J* G! J5 ^ m# r
// 显示上一首歌曲，除非已到达第一首
( I0 d" J, m6 c0 P' J if (i > 0) {$ H5 G3 b/ I: S! V p& G
i--;/ @ C! X( \( |/ l A
displayMUSIC(i);2 P3 i8 P0 e0 T9 }- y# E0 C @3 ~
}/ W1 P8 i: l$ ~
}
+ y) c8 S- O: V. Y, t+ ]3 @% v; v
5 S) T1 M& t. I0 W/ [ function displayMUSIC(i) {4 G6 g5 Y, A' p, ~( B
document.getElementById("showMUSIC").innerHTML =# j, h y7 u- } B. c
"<ul>" +* q# g h" J, a {, d0 y
"<li>曲目：" +
1 i" Q" d0 v. ]! i- x9 ^$ `+ ] x.getElementsByTagName("TITLE")[0].childNodes[0].nodeValue + "</li>" +4 v8 S2 P( Z0 G+ K i
"<li>艺术家：" +
! V. F" [$ x$ a9 [8 p x.getElementsByTagName("ARTIST")[0].childNodes[0].nodeValue + "</li>" +* J2 j# y& c5 I
"<li>专辑：" +# D$ D. c* K9 ^9 r
x.getElementsByTagName("ALBUM")[0].childNodes[0].nodeValue + "</li>" +
' h7 m* ?* }' W ^, V6 @# G6 g "<li>国家：" +) z4 @6 l. i. T" ^8 f! ^6 T9 [7 l
x.getElementsByTagName("COUNTRY")[0].childNodes[0].nodeValue + "</li>" +
+ v" o: g& g3 p6 m8 ^ "<li>公司：" +- D- L: \: C3 S4 Q, e4 p" }& m
x.getElementsByTagName("COMPANY")[0].childNodes[0].nodeValue + "</li>" +- ^* E: _; V7 E6 [' O" ~
"<li>年份：" +' g. \. }, W3 l' M5 X! y9 D+ }
x.getElementsByTagName("YEAR")[0].childNodes[0].nodeValue + "</li>" ++ y* p0 l. F* f# u- _9 p
"</ul>"; D E( u+ R5 p
}
$ j$ P: s0 k; B: |4 k+ r" g1 _2 r! v4 w$ M0 L4 ^( ` D5 o
function loadDoc() {
- S% g3 e; o6 R) f) j- v
( E( Q- ?5 m& O document.getElementById("demo").innerHTML = table;
8 c# o) {" R& z8 J7 A }) m: y6 _$ N \ u$ G
5 O3 g8 v+ U( B </script>* C- N# f, B1 O/ o
. m& e8 b! i* ?# U3 G5 S' J/ D
% N( N1 J L7 Q5 i7 q/ Z8 \ h</body>6 H+ y0 y; v7 _+ W/ E& ~7 k, S
# d% O3 O1 q+ H- z. Y</html>6 M; ]( a. D* E# z0 n2 A3 {
9 e; G+ ^8 K# N r- b
1 ~. I) R# p v[/mw_shl_code]0 E6 p$ _% @3 Q# q. m1 S9 `* A
" H" K; P9 Y e2 ?, ^$ P4 Y4 u
4 T, f( I4 _2 `& |) n7 H m# U2 c( a# k( S3 E
XML文件
0 u% w# a' ^+ i0 P
1 a- g; S) l. C9 K[mw_shl_code=xml,true]<?xml version="1.0" encoding="utf-8"?># u. z7 y e/ x. D+ ]
<CATALOG>( j0 a/ o+ c$ M/ ?- Z
<TRACK>5 Z6 t* N0 B. E( _* Z7 J8 j
<TITLE>再见</TITLE>
' \& \1 w/ F7 s2 A: w* I<ARTIST>邓紫棋</ARTIST>
$ R+ D E' x, u" Q( d. W, F+ K6 K<ALBUM>新的心跳</ALBUM>
8 t. f% o" O1 b/ G( r, {<COUNTRY>中国</COUNTRY>
+ {) E0 _& d! V3 r# Z/ T/ a<COMPANY>邓紫棋工作室</COMPANY>3 @4 t# v9 R0 A3 q7 a
<YEAR>2016</YEAR>
7 t2 ?7 }3 Q X: z" [9 Y% Y</TRACK>
8 M- W; J4 p0 ^$ P0 ^) i0 V* H0 H1 h
<TRACK>
9 j5 F) o- D7 f1 S2 k' L<TITLE>All I Ask</TITLE>
/ T0 B4 m' C! m' H8 S+ [+ C<ARTIST>Adele</ARTIST>* w0 @) u7 J5 ^/ L8 }; W) P$ h
<ALBUM>25</ALBUM>2 i$ d; s% y; ?* {! U6 w
<COUNTRY>英国</COUNTRY>
, c4 [; p% {' S' k" ~" G( ^+ V<COMPANY>XL Recordings</COMPANY>
, \0 Z0 M; H7 y6 b8 j( v<YEAR>2015</YEAR>8 j% v' A2 w4 s5 r# t- N1 g' {& x
</TRACK>
/ H# }, M& N. @& m$ c8 a3 Q8 ?# o0 A: E5 X) V6 N. T
<TRACK>3 V- f: ^ p; |1 Z' Q: T
<TITLE>之乎者也</TITLE>
8 F% r: e- B9 K5 w, R7 E; r+ T* E<ARTIST>罗大佑</ARTIST>0 ~# _! d# S& u) n
<ALBUM>青春舞曲</ALBUM>- m- n- g2 |4 o) ]! l" C
<COUNTRY>中国</COUNTRY>
8 j/ C' t# j/ X6 M k/ h<COMPANY>滚石唱片</COMPANY>
! `; W2 O; r7 E, ? ^<YEAR>1982</YEAR>
9 v6 i* k2 W% \# t</TRACK>* `: Q) j- K0 k. c0 b
- D' b; _& `0 Z' X) Q- q& r& v% j+ O
<TRACK>+ |/ r+ b# F0 |! {% e3 R
<TITLE>Never Be Alone</TITLE>
" r- ~% D9 E* {* y3 o$ M<ARTIST>Shawn Mendes</ARTIST>
6 ^) X# k8 P% r( z<ALBUM>Handwritten</ALBUM>
5 z( `8 u% u5 E8 ]: V6 `<COUNTRY>加拿大</COUNTRY>/ D! o$ z J# a1 |/ [7 B5 U3 k1 Y. [
<COMPANY>环球唱片</COMPANY>
D( z9 G D: p# [+ b6 w! ?<YEAR>2015</YEAR>0 S! J1 t, U) K' f, Z% w
</TRACK>
0 A+ o2 P( M9 B' h) [
D h& j, G( N. G; J<TRACK>9 m2 M0 D& x7 ?6 M! @
<TITLE>慢慢</TITLE>$ ~. s! q( r5 u& v: u9 _
<ARTIST>张学友</ARTIST>
' z9 m' Z* L3 `! M- l; l) S: }6 d<ALBUM>忘记你我做不到</ALBUM>/ E5 A' _; j! x4 G
<COUNTRY>中国</COUNTRY>$ N8 p& `( Q3 u8 Q5 e6 ~
<COMPANY>环球唱片</COMPANY>
* E: a) G0 t, k3 Y! T. N% s5 u0 `3 o<YEAR>1996</YEAR>& I! W9 U& S; I U
</TRACK>
7 x3 p9 H8 A' d0 X
+ E) ]) ?# W& \% H2 Q* }9 Y<TRACK>
# y8 C; K$ c3 N<TITLE>Complicated</TITLE>" L" `; k- t4 {. ]5 v
<ARTIST>Avril Lavigne</ARTIST>' W3 {! B: M/ ]2 O2 R! U2 z0 @ e/ r
<ALBUM>Let Go</ALBUM>
3 m9 {8 b( A. u7 C; F: a% j<COUNTRY>加拿大</COUNTRY>1 G. M) J+ s( ?; Z* n: w4 G
<COMPANY>索尼音乐</COMPANY>
5 }2 p' X; u% P3 t% O<YEAR>2002</YEAR>! ~, ]! f- f- a
</TRACK>: l/ [5 g1 ^& L' B9 c) E9 h
% i( p- `; M. f9 c<TRACK>- i6 R" c6 K. U
<TITLE>三生三世</TITLE>
" ]( u$ h% G, R- [7 r7 b<ARTIST>张杰</ARTIST>/ l# N5 ?9 t1 d. M2 v" V. c
<ALBUM>三生三世十里桃花</ALBUM>
7 o4 k6 p: O3 E' w0 M& @<COUNTRY>中国</COUNTRY>0 T' ~; D& \+ S( p
<COMPANY>仁溪音乐</COMPANY>
( o1 `+ Y, P U, a1 J<YEAR>2018</YEAR>9 U$ {9 _% N5 ^) Z6 \
</TRACK>* a6 z* D* E3 _8 \: ~& r8 k
- I* @% }. _9 j0 I<TRACK>
; B& V$ D2 d# V/ Y2 Y) U<TITLE>Five Hundred Miles</TITLE>9 A$ s, R9 }& M& D
<ARTIST>Justin Timberlake</ARTIST>; }! j2 E" B: K8 q* f- H
<ALBUM>Inside Llewyn Davis</ALBUM>! J, V6 V0 [ `) r
<COUNTRY>美国</COUNTRY>% t- T% |' J8 Q0 g6 {3 I$ w! G
<COMPANY>华纳唱片</COMPANY>$ z6 q+ N ?' ^; P
<YEAR>2013</YEAR>
- d! x1 Y+ ~5 K, @6 f R</TRACK>
! W' I! N4 g0 y) M4 ]( \) g1 U9 ]. ~* ~# R% ~+ B; g
<TRACK>
& K+ x- e3 F9 c0 t8 u; M( j<TITLE>演员</TITLE>
0 r( v8 K( H. A6 l/ c. ^1 R$ S& y% D<ARTIST>薛之谦</ARTIST>' n# {$ R: s+ h9 [% t
<ALBUM>绅士</ALBUM>
0 O6 ~2 ?: w. S& y/ C0 f/ d1 ]# I/ z<COUNTRY>中国</COUNTRY>1 p3 x; l' y+ u4 Q: N! m0 U+ v6 _5 C
<COMPANY>海蝶音乐</COMPANY>5 ^ R2 b" D2 w* l" y
<YEAR>2016</YEAR>! j: I" Q; x. x3 a% P9 Q
</TRACK>
& Q" _7 e6 O, y- x8 \4 |) s
* X$ e1 C7 A$ p5 U* {/ s<TRACK>
5 i e- p8 p3 s" F. ^8 N<TITLE>Numb</TITLE>
9 l0 P9 i+ j; u& @3 V) |. j<ARTIST>Linkin Park</ARTIST>
* ]8 i- X6 z2 S<ALBUM>Meteora</ALBUM>8 r- ^0 I. ~* B- q
<COUNTRY>美国</COUNTRY>: U9 E+ e0 ~. G3 h* Q
<COMPANY>华纳唱片</COMPANY>
0 F1 V& E3 O3 K* j9 q2 ?6 H<YEAR>2003</YEAR>3 g/ f1 i8 |, }5 k
</TRACK>8 G1 u. K6 z/ z: y
[& V9 n- t# n- r3 L0 c7 H: ~ @: N
<TRACK>' b/ y4 o B" w+ i
<TITLE>给未来的自己</TITLE>/ m+ f7 s. U5 G; t" J( |
<ARTIST>梁静茹</ARTIST>
* h2 a7 F2 O5 b<ALBUM>崇拜</ALBUM>
! J4 e. R4 V3 ]- \7 X( e<COUNTRY>马来西亚</COUNTRY>5 y0 A7 J ~/ }
<COMPANY>相信音乐</COMPANY>6 J8 |, e& L' Q6 ~0 ^
<YEAR>2007</YEAR>
4 k6 @1 o3 E9 m9 e! C6 H) ~</TRACK>: i2 q+ `9 |) Q7 ]) Y6 v% c! a
% O2 N' I# a% e7 s9 I' T$ a$ L
<TRACK>
0 A( w' j9 r3 S) ~1 F5 c<TITLE>The Monster</TITLE>* E7 a: H# f8 w0 @* u
<ARTIST>Rihanna</ARTIST>
# ^# I) k. s$ o# o+ x<ALBUM>The Marshall Mathers LP2</ALBUM>
' }5 F5 q" c4 e/ x/ L& Z( n<COUNTRY>巴巴多斯</COUNTRY>6 \* o+ X9 q" K% w
<COMPANY>环球唱片</COMPANY>
3 c% n. T* N* x% q- m<YEAR>2013</YEAR>
5 r0 l* f" a. f g. O</TRACK>! W( t9 E: G) r [0 T
- n2 n5 E2 M7 N
<TRACK>% N* f- K' g5 p2 k; Y: ]* _
<TITLE>我终于失去了你</TITLE>& Z3 F3 [7 Y& u$ T' D1 m$ r$ B% }
<ARTIST>赵传</ARTIST>7 f6 g" n& {! F9 ]
<ALBUM>我终于失去了你</ALBUM>
7 M8 B# e. ?1 A3 ]5 l<COUNTRY>中国</COUNTRY>
, b! v$ y7 P" e2 E. x- M0 j<COMPANY>滚石唱片</COMPANY>
( R1 \# i! o8 A4 d% n/ q<YEAR>1989</YEAR>( W, v3 B0 F, B" H
</TRACK>
% C& f) L; Z+ `# v
- o: v, H) o6 e8 h: d<TRACK>% S& m7 ^- H W
<TITLE>Main Titles</TITLE>
& f2 @1 j7 A& g, v1 i$ p7 q<ARTIST>Ramin Djawadi</ARTIST>2 a1 O; j8 F& r% J
<ALBUM>Game of Thrones</ALBUM>
7 a& o6 p3 }5 ? n& d<COUNTRY>德国</COUNTRY>2 R" S2 w- T8 j. q b2 @
<COMPANY>索尼音乐</COMPANY>
8 o4 d& f9 E# _) K' ?( T<YEAR>2011</YEAR>
. ]4 B* D. s; p* Y& D</TRACK>& N+ ~# K& ~9 W/ R: U
9 P, n! c% I" |<TRACK>; c/ c6 x+ I- F! s% B
<TITLE>传奇</TITLE>
7 B3 f- F; W5 `# w<ARTIST>李健</ARTIST>( t8 o4 d" L+ X: A; y
<ALBUM>似水流年</ALBUM>
9 I6 [, ~3 h) ~- g<COUNTRY>中国</COUNTRY>0 S$ Q; J6 L9 m5 p
<COMPANY>北京完美坚持文化艺术工作室</COMPANY>
/ f2 s" a" P- r9 b& k/ M5 u7 N6 R<YEAR>2003</YEAR>& l5 x! C( u1 a( d, z: S4 a. {
</TRACK>
6 w2 ]% Q6 X" s9 f- e. t7 J2 j; {4 G7 k' C' X- F# h4 M; U3 b
<TRACK>2 C0 p8 N$ U3 C" k+ W! x
<TITLE>完美生活</TITLE># g9 Q4 g+ U9 v
<ARTIST>许巍</ARTIST>
5 \ i8 M$ U) @# A6 w<ALBUM>时光漫步</ALBUM>
) C4 H: R9 t! v3 [<COUNTRY>中国</COUNTRY>
# e. P, g* V$ d, B k<COMPANY>金牌大风</COMPANY>
+ n6 V e8 m, _3 w<YEAR>2002</YEAR>
, Y5 S" r" W k& ]8 `) Z/ q9 ~. s</TRACK>
! F. X9 _9 Q: `* R: y& P</CATALOG>[/mw_shl_code]
, m2 _7 Q, M& [( S7 a |
|
|小黑屋|手机版|PLM之家-企业数智化转型工业软件学习平台
