|
|
请使用QQ关联注册PLM之家，学习更多关于内容，更多精彩原创视频供你学习！
您需要 登录 才可以下载或查看，没有账号？注册
x
& O" a( s& K! q- s
1 [3 d) o; J8 g$ V7 G( M
a3 ^' T' W4 E1 {) z1 j; j
[mw_shl_code=html,true]/ ?& [1 D1 z; L7 x
/ u" B8 u. F; h1 E; U" Z
<!DOCTYPE html>
, o: M5 @" F6 ]2 W% S5 z, z<html>
: {# n3 c* U4 u! X5 A) u# _% [<header>
5 _% b' n. V0 Y, i* i0 G <style>
, D5 }9 h. e( a table,
/ U/ p5 ~: p% f) d3 Q5 }3 _) j8 J tr,5 Z% }7 |& K/ Y
th,4 g0 w& `8 m/ b+ i/ {" I
td {
; K+ w2 O) K) b1 _4 J, a8 Q border: 2px solid rgb(20, 59, 230);
* V* ?6 Y. I' Y6 x! w, ~ border-collapse: collapse;. ]8 I/ z) q# `; M+ F
text-align: center;
) H, ?) G2 A% M8 B/ d }2 I: O8 ^2 ]) B
; D7 y+ l+ c% Z3 V. K
th,& v, C# D3 E7 X5 G% e: i6 f
td {! H' r, [8 U; v d! L
padding: 5px;
5 F" B0 |' M6 J% ]5 Q }
5 S: D# O/ ?$ z </style>
2 E! Q Q0 z% s9 _- a3 O: l</header># X0 ~$ u: L1 S% { x
^( R0 `& a& i$ B
<body>
, B6 z, @8 f7 E; b <h1>xml http request object</h1>5 u/ C+ e/ D$ }; E8 T7 ~1 F
<button type="button">Display Music</button>
; y/ |4 n: N; O6 x3 r' X <button type="button">Previous</button>
2 G- |4 T+ n% | <button type="button">Next</button>* y y3 o c; S) a- u# p
<button type="button">get my music list</button>4 F- L# q5 ?2 S! U8 l6 z
<table id="showMUSIC"></table>
: B* r/ U2 |1 \5 ? <table id="demo"></table>
]# u- M# {# \2 C0 ]0 ~ <script>; u9 b2 \1 c$ H( \6 R
3 ^; D; a3 O5 e, t
var x, xmlhttp, xmlDoc;
$ y% c0 j/ U. [5 [ # e' d! S8 Z2 z8 n* {3 x
xmlhttp = new XMLHttpRequest();, e0 s; u+ O) ?* h8 t! @8 C, q/ q
xmlhttp.open("GET", "/files/music_list.xml", false);
& v6 h" c0 r$ G0 H- f7 b xmlhttp.send();$ X- {9 | N' W$ s1 X0 n6 D+ h
! `) C! w5 r8 d$ b xmlDoc = xmlhttp.responseXML; 9 G" t( K! r% `6 q9 S
var table = "<tr> <th>Owner</th> <th>User</th></tr>"7 J$ Y) X# c+ [. m) d
var content = document.getElementById('demo');
6 d+ w5 d* k% ]' ?6 k. C7 b& ^ var x = xmlDoc.getElementsByTagName('TRACK');+ _; @8 Z5 p. z9 O! P
for (i = 0; i <x.length; i++) {
; R1 x& A+ o( { table += "<tr onclick='displayMUSIC(" + i + ")'><td>";5 }' m2 j; Y0 t7 z- R& f
table += x.getElementsByTagName("ARTIST")[0].childNodes[0].nodeValue;! f- Q. q$ b) H8 \5 V& u
table += "</td><td>";
5 N \8 G0 l5 F table += x.getElementsByTagName("TITLE")[0].childNodes[0].nodeValue;
; B5 d- k- P. k) V# H table += "</td></tr>";
- m6 }9 l0 B) M1 W: }}
J1 M5 r6 N/ A2 ?% O- b* V7 v6 d5 f' V/ p% U N' h: u% _
document.getElementById("demo").innerHTML = table;
+ z1 t: o+ t" I8 q' l5 b+ hvar i = 0;8 _# c, F0 ?# n: O- V
function next() {
' V$ n2 Y# ?! |# l) N# Y // 显示下一首歌曲，除非已到达最后一首
1 S# d- w1 G- B1 g6 d if (i < x.length - 1) {9 c1 S7 B* j( _& I! q) X) d4 e/ b
i++;
, T" p- W$ f1 _$ G displayMUSIC(i);' v1 E) R- U5 c" B* S- B
}
* k" H1 @1 P4 F A# v5 i: | }
% `4 p# v3 @3 O! l" }' \- P8 D% N) u: g
function previous() {
$ ]$ D7 g! `! P' l // 显示上一首歌曲，除非已到达第一首! f) ]! G) J1 W* _5 ?* O4 O
if (i > 0) {
2 A3 K- {3 B# M9 [0 w: e0 j8 f i--;
- h) L- h4 Q0 W* {2 w# b6 m displayMUSIC(i);
0 u7 y5 T5 A1 O7 A }1 X) Q0 a# Y) J) ~) x, S
}
$ q1 E3 }2 h$ B, Y5 i' g; Z* X; L; s4 [) ?( `# U$ [
function displayMUSIC(i) {1 P2 B8 C; }( Z9 ]& B
document.getElementById("showMUSIC").innerHTML =
6 H! a1 H( a* |, z "<ul>" +
5 l5 L& f- o1 C C% C# Q "<li>曲目：" +, F2 G- |2 U% m; k% x
x.getElementsByTagName("TITLE")[0].childNodes[0].nodeValue + "</li>" +
, I7 i6 I! N/ `+ N "<li>艺术家：" +
: E4 [5 i! w, Q" ^) c x.getElementsByTagName("ARTIST")[0].childNodes[0].nodeValue + "</li>" +
# O- D7 q9 e# C% o! m7 R, Q* H4 R "<li>专辑：" +, N+ r9 P0 R. R9 |3 K
x.getElementsByTagName("ALBUM")[0].childNodes[0].nodeValue + "</li>" +: _, N5 M5 |& C8 ~8 j: P" E4 F
"<li>国家：" +
2 S$ P+ d4 l0 V x.getElementsByTagName("COUNTRY")[0].childNodes[0].nodeValue + "</li>" +
5 D; d( d( j+ Q) F' V "<li>公司：" +
3 C [- H2 G; ] x.getElementsByTagName("COMPANY")[0].childNodes[0].nodeValue + "</li>" +" ~, a: f H' A5 ?. `% ^
"<li>年份：" +
* B! M9 ~" J( J. r% Q7 ` x.getElementsByTagName("YEAR")[0].childNodes[0].nodeValue + "</li>" +
6 _: k9 W& \% f. y- Q0 G "</ul>";
/ w% f( Z3 i } A! G }
; T e( u% Z5 H& q: B
0 M! y6 d0 n3 @1 V( _5 _7 R function loadDoc() {5 A# u! ?8 K9 Q+ W/ ~; V8 m
! j. y* o, D) B/ d& o0 }
document.getElementById("demo").innerHTML = table;
# v$ {% w' }* q' r/ X! Z }5 ]5 W: q4 d( T
% L$ R' t5 _4 i- R5 B* A </script>
3 r, e$ } I6 ^' R
+ e& | d% u8 [% c8 }! r( N
8 s, b( [ h+ ~) g/ z2 Q</body>
% |) s+ R: ?; f* J. i' `+ x) z8 `6 t j% f8 C- T, s3 M9 E* q* ^
</html>' {4 Q0 \+ Z. b7 N0 A: }
$ n" | g8 B b1 z( w' g5 Z
* d" E3 }, L! N[/mw_shl_code]. W: B/ X/ ]0 t! M
, A8 u+ X3 B3 x2 I5 o6 |* w; Y
7 q1 ^1 g) C/ M/ @. T9 f7 o8 r- Q$ _8 ]$ y3 A( \& q7 ?0 h
XML文件8 B+ l/ M8 F9 @4 [1 ]4 S7 G) R, Z
5 V: S/ M7 q* y6 p6 W2 l9 O[mw_shl_code=xml,true]<?xml version="1.0" encoding="utf-8"?>
) m+ C% a+ D4 o- {$ j<CATALOG>
+ Z* l; [, h4 W! g4 p" Q$ R<TRACK>; e. t3 S- D$ M& P8 ?
<TITLE>再见</TITLE>1 c+ H1 q: [6 k4 ~
<ARTIST>邓紫棋</ARTIST>
; V6 g2 I% W" K7 X1 R1 ?<ALBUM>新的心跳</ALBUM>( G# {& A. N8 k
<COUNTRY>中国</COUNTRY>+ ^* u5 o/ O5 N9 }$ ~1 Q7 s) x3 \
<COMPANY>邓紫棋工作室</COMPANY>! _1 }1 O! r- W/ `3 C- S
<YEAR>2016</YEAR>
9 W, }1 D3 |% K- ?# d1 K; g V3 N</TRACK>
9 j* ^2 s) a, S/ m4 r; @" g8 d- q3 w4 R
' R# X* k1 @& I& E$ d6 O) T+ F<TRACK>5 d4 k1 u1 ^; p( g( O# i
<TITLE>All I Ask</TITLE>: ?+ `& f% I7 `1 q" d$ |$ G
<ARTIST>Adele</ARTIST>
3 R7 u% ^$ R3 \. _2 q' C+ s<ALBUM>25</ALBUM>
% ~, r# s* O6 M7 {! h3 ` K<COUNTRY>英国</COUNTRY>- H6 v0 r% V+ t+ a) }+ f
<COMPANY>XL Recordings</COMPANY>
* U4 t' t9 b8 m2 S, v( G<YEAR>2015</YEAR>; Z2 M8 Z" C, l6 D* C" T
</TRACK>. R. ]5 N! q: l- F6 Y9 [; k
) Z: [9 t1 T- b' }# k' u: x<TRACK>
6 c9 }# e; a6 w9 K+ R4 k' u; V2 \<TITLE>之乎者也</TITLE>8 v. K5 w k/ Q/ [, x1 d- E9 Z
<ARTIST>罗大佑</ARTIST>
1 Z; [* f% S B' P" U0 ?3 D<ALBUM>青春舞曲</ALBUM>; b" T+ s0 N) `2 i
<COUNTRY>中国</COUNTRY>
* E' L- F5 z9 Q/ r<COMPANY>滚石唱片</COMPANY>/ o$ Y1 z2 }" f+ k
<YEAR>1982</YEAR>
# ]: ^* e" r- [% _</TRACK>
1 X& E! I5 T3 Y3 ^. t+ q1 I. x/ U% M* A3 \. ]0 b
<TRACK>
+ ~6 |% B0 ^0 A) ` w$ }" Z<TITLE>Never Be Alone</TITLE>" w8 U4 A; N0 Q
<ARTIST>Shawn Mendes</ARTIST>3 m5 q" _& u8 a* J
<ALBUM>Handwritten</ALBUM>! h. V' k7 P8 h. [1 {
<COUNTRY>加拿大</COUNTRY>
1 W* G3 M$ ~5 I% k$ [9 w<COMPANY>环球唱片</COMPANY>
. Y4 d# E5 x: b. A<YEAR>2015</YEAR>
2 l8 r$ T5 I6 y2 L</TRACK>8 ]: i4 U5 O8 K- D
# r: _ R. S. ~6 r/ ^+ f1 `) n, I<TRACK>5 c& C8 p( r/ N) l A
<TITLE>慢慢</TITLE>, F/ m4 E% y. u ]& o2 m- ^
<ARTIST>张学友</ARTIST>6 x* }/ o8 b# |- ^. x6 k
<ALBUM>忘记你我做不到</ALBUM>
+ ]; Q. n; q: n9 `( v1 @<COUNTRY>中国</COUNTRY>* W1 ^- R- u: B8 p# c$ n
<COMPANY>环球唱片</COMPANY>
# M( a/ i. B! L: q. ~6 H6 Y<YEAR>1996</YEAR>7 d; N3 }! f5 j$ @' Z. A2 @8 n# b
</TRACK>. w1 _, R: @# k; I* X
3 |3 `6 \" d; U8 @! N; _% g. R
<TRACK>- {" @- `$ k: `5 @9 K2 I
<TITLE>Complicated</TITLE>( Z$ L: ^8 y6 N x5 m3 d
<ARTIST>Avril Lavigne</ARTIST>+ A8 j" ^- t. V3 V1 |
<ALBUM>Let Go</ALBUM>0 r8 B( ?: g9 k* k5 A
<COUNTRY>加拿大</COUNTRY>
W& m1 v. | q<COMPANY>索尼音乐</COMPANY>
' c! N7 M' i. ^8 I% V7 T<YEAR>2002</YEAR>
( T. l3 D. P5 e</TRACK>1 J j" Y) }' t; A
0 d& H) H" d7 k2 V: l7 ~1 w% _4 e& p2 d<TRACK>
. R. r0 ~$ s6 g<TITLE>三生三世</TITLE>& u$ z r' G6 V4 ~, O6 m& L9 m- a
<ARTIST>张杰</ARTIST>% @( M( H: {; q% X9 y1 z- V
<ALBUM>三生三世十里桃花</ALBUM>! H5 q& l+ J( E: ]" H: \
<COUNTRY>中国</COUNTRY>
# ~) H& H: Z3 D% |<COMPANY>仁溪音乐</COMPANY>" b; j8 F k, Q9 m; p {. W
<YEAR>2018</YEAR>
]5 e4 [8 {/ j* j$ }+ T2 c. Y</TRACK>5 E- Y+ S' A. V( \. Q
' O) B' n% D3 S1 {( `<TRACK>
+ V/ Z( Z" o2 ?8 v<TITLE>Five Hundred Miles</TITLE>
2 B" u0 o& n- [<ARTIST>Justin Timberlake</ARTIST>
- G7 c: W* x+ @<ALBUM>Inside Llewyn Davis</ALBUM>- B0 A* m2 I7 f
<COUNTRY>美国</COUNTRY>
: o# V5 z6 Y4 b+ t* {; U<COMPANY>华纳唱片</COMPANY>
% V7 {7 y/ l4 @1 R3 i. `" m: W<YEAR>2013</YEAR># _( ?3 Y. G. @. [
</TRACK>
( t' U/ s8 U B8 O" d! ~9 k) k6 R
<TRACK>+ L' ~1 W$ H7 Q- r( Y
<TITLE>演员</TITLE>
$ z% X( A G1 S. Q3 W: H3 H0 U<ARTIST>薛之谦</ARTIST>5 X2 m/ {' i+ Y5 J, h6 J
<ALBUM>绅士</ALBUM>1 c7 g+ `* O3 v
<COUNTRY>中国</COUNTRY>3 N% f3 @% J$ E, G7 m
<COMPANY>海蝶音乐</COMPANY>" s" h3 y# t9 j4 ^# I! u
<YEAR>2016</YEAR>
3 ^3 y6 a' ?) H! b/ k# T</TRACK>4 U' ^* p: ~" G+ i3 s" ~3 Y) c+ d
) c. a5 E4 f' h$ O
<TRACK>
+ W/ D; M: b8 z) @% `0 G- G, L! `<TITLE>Numb</TITLE>
! X. Q- b4 D9 e- H( }# J3 U<ARTIST>Linkin Park</ARTIST>9 ~' g( R7 {7 T$ n5 v K" n
<ALBUM>Meteora</ALBUM>9 ~; d7 O& U/ p& L" r
<COUNTRY>美国</COUNTRY>; O' Y) x7 L$ k
<COMPANY>华纳唱片</COMPANY>
6 k7 O7 W& X; Y5 p<YEAR>2003</YEAR> y8 A: t q" ?0 u- [
</TRACK>
. I2 S( d5 }& X) x! e# ?# v# ~; s! i4 ]0 T* Z0 h4 v% W
<TRACK>( G6 H' x# f; J, h& R, Q! v1 ?+ J
<TITLE>给未来的自己</TITLE>
. d: C; V' F: F; \& c7 U& R<ARTIST>梁静茹</ARTIST>
$ ^1 K3 \7 P; m<ALBUM>崇拜</ALBUM>
# C. @! ]) p- \: B w; O1 j<COUNTRY>马来西亚</COUNTRY>
5 W2 r( a, U0 b1 Z<COMPANY>相信音乐</COMPANY>) e9 ?9 o) F% g6 G `% d' I
<YEAR>2007</YEAR>
; t; p, R( {+ B1 |</TRACK>
. x- s- J" n7 o8 d
, s% h( e9 Q% r/ g9 r: `+ k<TRACK>" o9 S- C2 V4 y" p8 `* c
<TITLE>The Monster</TITLE>6 C3 _* U# l" O: Q! ]2 n) K
<ARTIST>Rihanna</ARTIST>( y7 I( y# r. N8 F- `( ?: z+ j
<ALBUM>The Marshall Mathers LP2</ALBUM>
/ u y: D8 c: v1 I- ?<COUNTRY>巴巴多斯</COUNTRY>
; U z+ v" _: O& |/ y4 U. ?<COMPANY>环球唱片</COMPANY>% W6 o% a/ Z; S$ Q
<YEAR>2013</YEAR>2 A: R0 e* d2 t; M+ @ V
</TRACK>% k5 d8 |0 d" g1 P- K
; y- T; q o$ B2 p, S1 v- i
<TRACK>
, j" d; u# k! a# l. W1 A5 c<TITLE>我终于失去了你</TITLE>
& F3 A: N4 l( m; W+ B2 W6 N- M% W<ARTIST>赵传</ARTIST>
+ s0 y2 E) m, s- B/ j<ALBUM>我终于失去了你</ALBUM>* H+ p9 r! K* F" a# H
<COUNTRY>中国</COUNTRY>4 }1 A! v: k% L
<COMPANY>滚石唱片</COMPANY>9 }1 n% p% X; m( o
<YEAR>1989</YEAR>
{, h' k* X6 L</TRACK>
/ C& b( W* a6 n
- D) M& q2 L. L<TRACK>
/ S1 g7 Q! k7 B7 h<TITLE>Main Titles</TITLE>
/ K+ P; U9 b3 l; P" C6 h<ARTIST>Ramin Djawadi</ARTIST>
& I/ T: J; X! Q }<ALBUM>Game of Thrones</ALBUM>3 Y0 x7 z9 B" ?$ ~- I9 i; P
<COUNTRY>德国</COUNTRY>" t. r0 p1 t$ |- E1 Q
<COMPANY>索尼音乐</COMPANY>
& y7 F0 G* s0 X- d" C4 x4 o<YEAR>2011</YEAR>2 C+ H) h+ r' p2 U& Q7 e
</TRACK>! s; B- ^. B+ I5 l
, t+ ^/ T" n! U<TRACK>0 `; W0 u2 x& w, ^* ]
<TITLE>传奇</TITLE>
S1 c4 |9 z: ?) o: ?# [ ?4 O* h<ARTIST>李健</ARTIST>; {$ N) G5 m& M
<ALBUM>似水流年</ALBUM>( }3 |) j# w2 d0 `; O$ E
<COUNTRY>中国</COUNTRY>
5 ` [/ X% h9 k/ o: a/ S$ l- |<COMPANY>北京完美坚持文化艺术工作室</COMPANY>0 n% j$ X5 y8 F) R0 Z4 _
<YEAR>2003</YEAR>8 R5 H' _& _" N/ D+ t: c1 ~/ J
</TRACK>
: b: F C% G4 U1 T- @ H1 t# b. T3 y5 i6 k! e
<TRACK>6 F3 W5 |; v) T$ r. s
<TITLE>完美生活</TITLE>
: `/ q' a; X7 R8 [; k7 o! r* N<ARTIST>许巍</ARTIST>! Q0 o: c' [2 W1 x( P- _
<ALBUM>时光漫步</ALBUM> V7 s7 v3 ^2 |0 r8 y/ F
<COUNTRY>中国</COUNTRY>$ B& O4 `3 n: T9 R/ x
<COMPANY>金牌大风</COMPANY>3 z1 ~4 G: D4 p8 k/ f
<YEAR>2002</YEAR>
! Y& E1 C& w! o1 ^: i</TRACK>( C) f5 D* j% l. Q( ^ l8 f
</CATALOG>[/mw_shl_code]
. T, O* I& M, P( d& P |
|
|小黑屋|手机版|PLM之家-企业数智化转型工业软件学习平台
