|
|
请使用QQ关联注册PLM之家，学习更多关于内容，更多精彩原创视频供你学习！
您需要 登录 才可以下载或查看，没有账号？注册
x
+ E) \4 f2 o/ _" L4 I q+ U9 ^0 o. ^/ T( l2 i k& ?% H$ m
# L0 b- X5 ?% Q8 z8 Z# t7 b; o* y[mw_shl_code=html,true]
; {# L/ ^% A/ m5 D- p6 X, C0 Z u2 [
<!DOCTYPE html>! ^9 R0 \/ Q# X7 p
<html>; r% I# d8 ]; M: l& I+ F
<header>
) a7 q8 q* I# z/ [9 {! [$ i <style>; L2 e4 U# E1 m1 U1 ~
table,; i7 I/ v( z: n1 c
tr,& W! K" ^$ b; a5 @" E1 W
th,
" l# _2 W2 J, [0 P* t! ? td {
' G1 I# i9 A) l2 c! l# b$ _5 o* V6 h) ^ border: 2px solid rgb(20, 59, 230);# X& j e- {; t. W' V
border-collapse: collapse;* a; I) }) I& N8 r! p! W7 J6 A+ w
text-align: center;
6 T/ H9 F7 J9 ]) T }2 A2 N, t) e# A. O' X
4 R9 U6 y4 b9 C th,
- T1 a7 G8 Z- i5 T2 ]5 C, b8 ~, n4 o p td {
* U, _ C' y! k6 l/ j) D. R! W padding: 5px;
{0 V: p5 y- ]2 R/ P! J0 b9 G; O }
" w3 |& G" W; }/ [+ | </style>+ H! ?) I% r8 x. e) \) s
</header>
8 S' z m5 p0 x9 W2 k' R7 Q
6 s- @' z8 e6 n; Z, n0 k<body>
; {5 u& J3 o3 ? <h1>xml http request object</h1>
( D+ h7 _0 K& X N4 F8 b <button type="button">Display Music</button>' I9 Y$ Q6 k3 U" h H
<button type="button">Previous</button>6 V U/ p& F1 y& a) I6 G# n
<button type="button">Next</button>
! P8 T. r6 n b( w <button type="button">get my music list</button># b" P1 f5 u* E3 b0 V7 w( I+ E8 }
<table id="showMUSIC"></table>5 [& h/ t5 {: r8 ?
<table id="demo"></table>4 ~0 b3 X) h3 I ]5 Z/ o
<script>( Y0 g$ U$ y4 y% E2 x
% w; X1 F+ c- u var x, xmlhttp, xmlDoc;
% Y7 Z% A9 z5 Y
- a" ~1 G. v3 W xmlhttp = new XMLHttpRequest();% {, j4 t- \0 D( A( [
xmlhttp.open("GET", "/files/music_list.xml", false);: w9 S6 N3 d/ S8 h, o. u4 B& A- }
xmlhttp.send();4 \/ w$ E+ Z6 X' I: c
: c5 e4 {2 \1 p* ~2 [4 \; u) R xmlDoc = xmlhttp.responseXML;
. _. b# I' _9 w$ f var table = "<tr> <th>Owner</th> <th>User</th></tr>"+ i" B: ?. [# D5 E
var content = document.getElementById('demo');6 |7 E8 f' r" M1 K6 i$ {" ?: \
var x = xmlDoc.getElementsByTagName('TRACK');2 o X& m& ]6 f- \! _+ Z) s1 E
for (i = 0; i <x.length; i++) { ) a. S6 ^( F8 m a
table += "<tr onclick='displayMUSIC(" + i + ")'><td>";
! C6 \- _0 y/ R9 z table += x.getElementsByTagName("ARTIST")[0].childNodes[0].nodeValue;) {* _, f: k4 V
table += "</td><td>";
+ K+ H( m! Q( v- S0 ]- G! A table += x.getElementsByTagName("TITLE")[0].childNodes[0].nodeValue;
- `0 g5 `: G- M/ c6 t) x- h table += "</td></tr>";
6 f) F$ ?6 M; @; i6 v9 Y& ~}
- R2 D# Z4 e& W- W- A+ t
% f' ?1 Q- m7 D2 g( pdocument.getElementById("demo").innerHTML = table;1 J: X# K$ K" `# S0 N# ~6 B
var i = 0;
0 s7 z$ ]6 ?3 r( B3 p4 l function next() {: o ^5 f" N" t- r2 _9 x
// 显示下一首歌曲，除非已到达最后一首
% p7 H D3 M4 r5 w- R1 G: {$ q8 N if (i < x.length - 1) {
L+ n( C* e: r2 b& w$ [* D6 b i++;
4 V& b& A" e9 M: H# o displayMUSIC(i);
3 d9 J% h C% A& i; l2 E9 r; C5 ~ }
7 r7 r% @2 a) l. _0 P# k }4 y! }; h9 D' h9 `4 U
4 Y" ]2 g5 ~1 L1 E8 N
function previous() {& g/ ^4 u) ]3 y. T2 y$ q% G
// 显示上一首歌曲，除非已到达第一首( P+ t) n; g* e8 P$ u
if (i > 0) {
% S4 ^4 J/ @" v4 w! E. h i i--;+ @ q3 r* A5 y- ]
displayMUSIC(i);$ q# H' Q C9 f- w2 d
}; j- E% h3 @+ E0 |. V
}
6 J' R* g0 k: b0 T" x9 B) l. C$ s
: i% o) J! P: U3 C8 Y) H; W: L function displayMUSIC(i) {1 {2 b3 R S) n% L \
document.getElementById("showMUSIC").innerHTML =/ O0 g6 n/ _( Y8 ~, x1 \9 k+ Q3 y
"<ul>" +
, o' g$ K$ c) x, @6 c "<li>曲目：" +
% w \7 s% l1 j, G/ ] x.getElementsByTagName("TITLE")[0].childNodes[0].nodeValue + "</li>" +
6 G$ ]) z+ w! L% j5 p; ^8 { I "<li>艺术家：" +* I- z- O% E4 K* y% }
x.getElementsByTagName("ARTIST")[0].childNodes[0].nodeValue + "</li>" +! Y" s/ \4 w7 Q7 z4 X ~3 u, g
"<li>专辑：" +% a9 p7 q, p1 I: D
x.getElementsByTagName("ALBUM")[0].childNodes[0].nodeValue + "</li>" +
. L4 R% ~! E7 i. ]6 E "<li>国家：" +6 T! w, k+ B! n# v% A6 l7 z9 L
x.getElementsByTagName("COUNTRY")[0].childNodes[0].nodeValue + "</li>" +- c, s( }9 q: l" Q* X4 V4 _ w, c
"<li>公司：" +3 R3 O u8 A' s5 K6 b
x.getElementsByTagName("COMPANY")[0].childNodes[0].nodeValue + "</li>" +
+ c, r& N, N! e8 Z! c( Q- F "<li>年份：" +
- L+ }7 L3 n, }0 z5 U+ `* V7 Y- G x.getElementsByTagName("YEAR")[0].childNodes[0].nodeValue + "</li>" +
6 M$ x6 c7 f3 B- D: u1 N "</ul>";3 ^" W# A* Y& U2 c+ t( ~5 C2 B
}
* j0 c( a' v5 L/ ~4 q% F: W/ B! u6 y8 Q. @" H; n+ g6 [ x5 \% n; p2 a
function loadDoc() {1 o1 w& @5 C) v( h! Q0 p8 U
) J: m" a. j* P
document.getElementById("demo").innerHTML = table;: m0 I" {* o" G
}
l5 j }! F R' q2 d0 _ S C
* ^- Z/ S) @0 ]6 P0 c! e1 ` </script>
, l, t! ]# m$ n' U }7 f& Y& b$ @6 ?9 k2 m- B. @" ?" O
/ u) H! k4 P' {6 [$ h</body>
9 D, V" E2 e6 V& i7 P: Z& C% A, W: t9 D: ?9 \, R
</html>/ k6 Q/ I) W' X* z ]
( v, K( v) Y" H2 W: A3 m% T. @5 f+ b8 T5 S( y; K% |
[/mw_shl_code]
- ?. D, ?- s2 G. ?6 w
6 C+ U2 s$ d* t) L6 f
( G |" e. Y3 E9 a; A, g# H) f b' s6 |0 t3 y3 w* f
XML文件
+ b4 t/ P; z! c3 K. \& r$ G9 z* }% }% |: W3 u
[mw_shl_code=xml,true]<?xml version="1.0" encoding="utf-8"?>
5 w! n% f0 q5 J<CATALOG>3 E+ R5 _% C2 X' o+ B
<TRACK>
! V9 ~0 b" G) Y# j2 l<TITLE>再见</TITLE>- _7 W: E8 \) O% S | z4 J! H
<ARTIST>邓紫棋</ARTIST>
; p) d# A1 \* H" B) T<ALBUM>新的心跳</ALBUM>0 f* o* K1 K% J8 |1 C
<COUNTRY>中国</COUNTRY>
3 H; I. `- x) E3 j0 _; I<COMPANY>邓紫棋工作室</COMPANY>) t. l, i! S! t; |7 g
<YEAR>2016</YEAR>
' v& Q+ M0 N1 o! H' l</TRACK>( |3 I9 \2 \' ^! y5 x& l
, d) K9 `" h7 K5 v3 B" O
<TRACK>
8 ~+ b9 R0 o1 W5 _4 g1 \1 Y; D<TITLE>All I Ask</TITLE>
1 z1 c, O% ?! Y/ N, ^" D7 \<ARTIST>Adele</ARTIST>
9 x. V* f" a# h9 m<ALBUM>25</ALBUM> e* E+ B: k' X2 v* [" Q
<COUNTRY>英国</COUNTRY>
: s1 b7 g! D" O" P* e; r$ D<COMPANY>XL Recordings</COMPANY>( F; c7 m1 C7 j1 X( A6 C
<YEAR>2015</YEAR>
& p9 a/ _* S) `% M+ s; [9 W% P</TRACK>
* o9 L1 l0 h# R c" Y* E6 \6 r% a- k5 p1 Z) P
<TRACK>
{, ~0 y( v( ^" l" Y9 |<TITLE>之乎者也</TITLE>
7 l$ g. Y1 b) L) F) F<ARTIST>罗大佑</ARTIST>9 ?$ p+ N& k/ E0 c1 d; w8 Y1 f
<ALBUM>青春舞曲</ALBUM>
) g+ J! U; V: n6 n, e$ C& G3 t- k: X<COUNTRY>中国</COUNTRY>
: w6 P1 L& R/ s6 [ c$ p1 i3 \9 U<COMPANY>滚石唱片</COMPANY>
; v3 H5 X6 t5 ~' z4 V<YEAR>1982</YEAR>. K9 ?0 p+ Y3 i9 _' N" f1 R8 z
</TRACK>
! d* W2 i0 t* i+ e5 o3 J6 }4 E& S8 b( }' l$ g
<TRACK>
/ u9 i l. \, q! i<TITLE>Never Be Alone</TITLE>
% A) v2 k3 K) g9 X; @. R<ARTIST>Shawn Mendes</ARTIST># F+ L3 @: z+ u4 Q* n7 x
<ALBUM>Handwritten</ALBUM>
" ^9 F/ B, F0 K" y<COUNTRY>加拿大</COUNTRY>
; v3 Q0 L' L) w, I<COMPANY>环球唱片</COMPANY>7 \* o" U& V& k# C5 Y
<YEAR>2015</YEAR>! W: y; j* @- Q& X
</TRACK>& L( R* [: x$ X1 U; P
- O9 Y# |' Y: e7 U; V
<TRACK>
. ^% h6 W7 M+ A( L: M% d, Y/ `<TITLE>慢慢</TITLE>
$ m. V0 G$ K$ \" `+ |& a) u% Y; Z9 t<ARTIST>张学友</ARTIST>
- C( L# l; y N8 Y! x& N<ALBUM>忘记你我做不到</ALBUM>
L" x* h9 G& q- ^. \+ s0 e<COUNTRY>中国</COUNTRY>. e5 O& @% \- e' C
<COMPANY>环球唱片</COMPANY>0 U, g' W( a3 a
<YEAR>1996</YEAR>
9 b2 t2 t: s4 Z ^' J5 z% ^</TRACK>3 e) N6 d3 t" M; m. b$ v
! d# z8 M$ b4 P7 K% Q. \
<TRACK>
9 L2 ]* B: I' j5 I0 X: q<TITLE>Complicated</TITLE>
2 j' B3 j- t- A7 h9 X<ARTIST>Avril Lavigne</ARTIST> y, a* j/ z' A& z- |7 [6 E
<ALBUM>Let Go</ALBUM>: N* v! K" f/ _; x0 x& c
<COUNTRY>加拿大</COUNTRY>
) K5 U3 V* V9 T: M! O+ I- E<COMPANY>索尼音乐</COMPANY>. ~, e; `$ o/ y: t
<YEAR>2002</YEAR>. V( @ n" a' r1 I/ z* N
</TRACK>
! |; g4 U& K2 T7 L) f0 ~& H1 Y$ P; X8 [% K9 z
<TRACK>
! u; ^" q8 s( ~<TITLE>三生三世</TITLE>: Q' F( {1 g4 I2 Z: N% c
<ARTIST>张杰</ARTIST>
+ ? |( S; ?# N z3 R+ h& i<ALBUM>三生三世十里桃花</ALBUM>; V4 I/ X8 a8 V+ P9 x/ m/ Q
<COUNTRY>中国</COUNTRY>- a% e1 D4 p, Z4 e9 {4 j9 E
<COMPANY>仁溪音乐</COMPANY>5 a6 U5 b0 h' o7 Y1 }6 g
<YEAR>2018</YEAR>: O4 ?9 a, @& S' m$ [+ }3 a) _1 _* _
</TRACK>+ S" J, I7 c2 b, m4 t, @
% [& H$ _+ e* T, V W
<TRACK>
( Z* Z. `. S. O7 Z<TITLE>Five Hundred Miles</TITLE>
- x) \$ }- Y- l5 i O<ARTIST>Justin Timberlake</ARTIST>
- u7 e4 [) q8 ~' I P<ALBUM>Inside Llewyn Davis</ALBUM>8 u/ x5 A7 p* ^/ X: t& d
<COUNTRY>美国</COUNTRY>
8 b& n) {$ s; O9 E! M! x) D$ J<COMPANY>华纳唱片</COMPANY>
- W. B) w" U, W, J4 n% I5 w<YEAR>2013</YEAR>5 r x! ~& C: F9 `/ [/ ]; o( [
</TRACK>
5 _1 a2 l9 c& |: C- b6 y8 _8 \8 t: E- a, i. q- ^
<TRACK>
2 h2 u! `- `" j: V<TITLE>演员</TITLE>
& |$ }4 [" _/ d2 Y% H" W<ARTIST>薛之谦</ARTIST>( M: U3 k/ n0 {7 F4 x
<ALBUM>绅士</ALBUM>
# W) M# S1 ?5 O<COUNTRY>中国</COUNTRY>
- o# V7 x0 f( Q; @1 p* S5 U1 V<COMPANY>海蝶音乐</COMPANY>- N' E, o( _, k3 L
<YEAR>2016</YEAR>, F5 d. c$ l2 y" n9 W
</TRACK>: o s2 Y0 x' A" F
( w& W' y3 C9 q# y/ Y<TRACK>" f: o* e) g) S9 J
<TITLE>Numb</TITLE># C* s: G+ F4 | u
<ARTIST>Linkin Park</ARTIST>
% B* K: a0 B( e' `! j, B<ALBUM>Meteora</ALBUM>
3 v4 n1 z3 s! E5 C2 I& v<COUNTRY>美国</COUNTRY>: M" d# ^" [& G" W% I
<COMPANY>华纳唱片</COMPANY>
' z& g' y3 a! m3 x<YEAR>2003</YEAR>3 R& {* ?& S5 ~! L( P* }
</TRACK>8 S% L: `9 o! \: u+ _% D' M5 f
9 J0 v0 Y, r( i% t! \<TRACK>
# z% @7 ~" Y( Z9 A<TITLE>给未来的自己</TITLE>9 A) H) ~5 a; m9 e% `6 r
<ARTIST>梁静茹</ARTIST>8 s7 o+ i/ c3 E' s7 h" Z! f4 D
<ALBUM>崇拜</ALBUM>( f l5 U2 ^4 D4 ?( I
<COUNTRY>马来西亚</COUNTRY>8 F. m( ?2 j: w8 N* j0 g* Q
<COMPANY>相信音乐</COMPANY>
! m# z" z' V7 Z+ ~& L0 R<YEAR>2007</YEAR>
" L+ s% W7 S3 I% l S" G</TRACK>
1 C& `. X2 @" E; s
- v; u3 O$ {, d<TRACK>
, e1 R& u* h, x9 @8 r<TITLE>The Monster</TITLE>7 i7 b7 H# i" g5 U
<ARTIST>Rihanna</ARTIST>: x5 Q5 L" P/ K
<ALBUM>The Marshall Mathers LP2</ALBUM>7 G' o* Z$ N; A- ]
<COUNTRY>巴巴多斯</COUNTRY>
: b- m+ ]4 s. V' L2 i1 e<COMPANY>环球唱片</COMPANY>
/ K# ? ?# I, p<YEAR>2013</YEAR>
. q' \1 B$ W! P9 z8 n</TRACK>' u) `' l F8 l6 E0 B
$ K" ]8 f8 y4 ^
<TRACK>
/ o2 x9 t. Z* A0 ?<TITLE>我终于失去了你</TITLE>
7 `/ }7 z0 ]8 C6 R; A<ARTIST>赵传</ARTIST>" H) j8 b. t6 O
<ALBUM>我终于失去了你</ALBUM>4 B: V6 z1 {2 i# o; K4 C1 _
<COUNTRY>中国</COUNTRY>" K2 W, i1 ^+ N
<COMPANY>滚石唱片</COMPANY>
0 ~* H y! j0 l4 k2 S" j8 Q<YEAR>1989</YEAR>
( `. t! k) Y B" k- S4 `' i</TRACK>
, t) L% G. Q" S" L( b; q$ C6 L* o" ~$ e* `( R' _
<TRACK>* X0 k, d5 L, k4 o9 O
<TITLE>Main Titles</TITLE>
/ U4 ?% O3 b0 r1 b( v7 g<ARTIST>Ramin Djawadi</ARTIST>- i, ?% S! Q9 u9 \4 a2 [2 m9 L
<ALBUM>Game of Thrones</ALBUM>
- V2 g, f+ ?3 J4 }* I" d! e<COUNTRY>德国</COUNTRY>
! Q2 E: E: G* X$ {% C1 g<COMPANY>索尼音乐</COMPANY>6 P$ ^, p" L5 ]0 D- p0 v1 D0 R \
<YEAR>2011</YEAR>
% W% E$ G. } k/ F</TRACK>& Q8 z; ^" v7 m% z2 Q
* U! R3 ^: n1 M6 P, K
<TRACK>
3 \- h8 M& F2 u" c. x3 T7 k<TITLE>传奇</TITLE>
' s; U7 t5 Z: @1 u<ARTIST>李健</ARTIST>
( n4 ? I2 N- h1 a<ALBUM>似水流年</ALBUM>8 W4 K9 T/ Y5 D9 v! {4 @
<COUNTRY>中国</COUNTRY>* K8 u) `1 ~4 y4 _/ C/ f8 G' h" X6 u
<COMPANY>北京完美坚持文化艺术工作室</COMPANY>4 s* J$ A# A) ^$ ?6 H1 ~
<YEAR>2003</YEAR>
5 p$ U" e' ~1 {</TRACK>! J3 t; @% o$ N {; w
# m& C. P+ [; U5 s) o
<TRACK>9 P! c2 |. p9 V1 W) q% S- d
<TITLE>完美生活</TITLE># ?8 w; A; [1 a1 Q6 o* U
<ARTIST>许巍</ARTIST> G. G$ ` m2 B
<ALBUM>时光漫步</ALBUM>; @9 L `+ @3 w6 G3 ~9 {9 Q
<COUNTRY>中国</COUNTRY>
* V- p' p/ t" @! f/ p+ l" L, n1 `, e<COMPANY>金牌大风</COMPANY>
% W8 n' M+ Y: _5 o3 d2 T3 w# y<YEAR>2002</YEAR>; b: ?, ^" A& Y* z
</TRACK>7 X4 L+ Y4 x% k, i) z! }
</CATALOG>[/mw_shl_code]# \ T) i8 L; m2 o9 H
|
|
|小黑屋|手机版|PLM之家-企业数智化转型工业软件学习平台
