|
|
请使用QQ关联注册PLM之家，学习更多关于内容，更多精彩原创视频供你学习！
您需要 登录 才可以下载或查看，没有账号？注册
x
3 a/ k* \: [6 C) m9 K
/ I: f( o2 O# x9 |" \8 u& i* R
/ |9 X3 E) I1 H/ F' c3 x
[mw_shl_code=html,true]
; V% D% p0 e4 q' t# x
) a! u, y/ u9 V+ y% w2 v" ^<!DOCTYPE html>
0 j; D/ X5 Y& E) x! f<html>' |! v+ r9 k0 D* @4 F$ ?
<header>; a7 A- e1 S' y
<style>, Y( M4 M( J' l0 s
table,
/ W' {# j# P* H3 e& W tr,
& A2 a3 w1 P1 l/ B* M# L th, \( m$ e1 r* d* t; X6 K% @
td {/ R. T. }3 N7 U( l
border: 2px solid rgb(20, 59, 230);' \3 [; X I a- D% D. z* v0 \0 d$ u
border-collapse: collapse;
( a4 x+ k T; N1 n# P G$ ? text-align: center;) }- W: M& R" g
}( g4 y C& z, _6 I
4 r+ Y. ^/ D& T" @3 j# }9 j
th,& h/ h+ V( r) u- K8 @5 a( g
td {
8 m* G, H: ~ U! Q. V padding: 5px;& S& [: X8 @, O- E
}
0 G% x" L# L3 N( } o </style>
& z! x/ D2 h( w/ \6 k6 }</header>
$ `$ b4 ?- {' _% C& B
% u4 g7 n, O i<body>
8 p& E' a8 V9 j# Q5 {" `( @ <h1>xml http request object</h1>
( B" z: ?) \3 _: f <button type="button">Display Music</button>0 {8 y# X% s& ]5 ?$ g4 R
<button type="button">Previous</button>8 M8 n% L8 a5 |7 S& V
<button type="button">Next</button>
) U1 z& P3 Y$ j <button type="button">get my music list</button>* V& F f& ?* F) h' G
<table id="showMUSIC"></table>
+ I( j) C+ R* `% Q" K$ Q" f$ O <table id="demo"></table>
: O* q0 z2 f1 h) A <script>& c0 V2 G( y' w. E6 ^
& ^) t' _7 ` _9 Z/ J2 a2 }8 Q var x, xmlhttp, xmlDoc;0 ]9 P. l2 u; V# Z1 I
6 m# G K2 e' `! _, m J# ` xmlhttp = new XMLHttpRequest();4 K' P( F( u0 {! d P
xmlhttp.open("GET", "/files/music_list.xml", false);5 u4 ]. A6 n5 z y+ n
xmlhttp.send();* x* ~9 a; u r; s7 p
- d% ]1 W' k1 s" Y0 v xmlDoc = xmlhttp.responseXML;
3 k, u0 z) z5 o% y6 ^ var table = "<tr> <th>Owner</th> <th>User</th></tr>"
- A! d! Y* J7 m3 u var content = document.getElementById('demo');
, l% t' t( R7 \0 t' `9 W" ~0 l* N) y var x = xmlDoc.getElementsByTagName('TRACK');
' s9 n* t6 k3 Y( T: |$ O for (i = 0; i <x.length; i++) {
3 C/ e! E0 y0 U6 O3 \8 O9 X table += "<tr onclick='displayMUSIC(" + i + ")'><td>";
" e3 x0 e9 f9 ]4 s/ ]# B table += x.getElementsByTagName("ARTIST")[0].childNodes[0].nodeValue;
6 C7 o, q; u* Y/ O% f6 d& j table += "</td><td>";2 J, k/ B9 M( u: `6 e9 M
table += x.getElementsByTagName("TITLE")[0].childNodes[0].nodeValue;
9 F! i& W# t9 h9 G+ ]2 a table += "</td></tr>";! H! z& i1 ^! q- w+ j: |% M4 W) }
}
8 j" H$ g' {5 x# d7 M, [, E1 W: L5 o. z, V7 v% v ~
document.getElementById("demo").innerHTML = table;6 U5 y$ q) @7 H8 v% o8 \; h( x
var i = 0;/ @) r2 T3 W% p! p& D: H
function next() {
% \. l; _( i! O' [ // 显示下一首歌曲，除非已到达最后一首# v7 Q8 l8 M3 A% b4 j6 v4 e& E
if (i < x.length - 1) {' L- e3 @+ b, }6 t6 ?5 L
i++;
" w+ o* c- q* p# p displayMUSIC(i);$ b+ O0 c1 s+ i4 U
}4 A9 p& t6 l6 y$ A
}
/ R/ l/ d; M* |0 i2 c, O: h7 o
2 I& F1 e* S# F+ o$ _: F function previous() {
" z' B: N3 V7 ^9 a' r7 R, c // 显示上一首歌曲，除非已到达第一首0 W5 z+ ?1 N* j$ O" P1 \7 X$ X
if (i > 0) {+ @5 O7 ?# H# Z. D% _9 S0 C
i--;; [4 D! Z7 t1 o: p a( w' t4 J
displayMUSIC(i);$ q& g+ R9 }+ d6 b/ D$ H+ y
}
' X4 f( R6 o8 Y) Z" j, {; J4 Y }
& D% Z; P) f. s! A, ?) Z/ `- i* J9 k8 c
+ V# N) P5 \8 p0 e+ P4 P0 E( u8 `# e function displayMUSIC(i) {
F7 ^. K. y; c; }9 P8 i" j document.getElementById("showMUSIC").innerHTML =+ M/ c- S1 E; o4 ]! X. i% c2 W3 _
"<ul>" +
& i, g, x* H; a$ w H- N4 H1 H "<li>曲目：" +
9 }8 J8 M3 b2 R3 n2 @' I% j5 a x.getElementsByTagName("TITLE")[0].childNodes[0].nodeValue + "</li>" +
2 V* T; H4 ~6 T" I "<li>艺术家：" + x, Y' V$ l: k! U a! B
x.getElementsByTagName("ARTIST")[0].childNodes[0].nodeValue + "</li>" +/ c% o( u K) g* E& B( H/ D6 E
"<li>专辑：" +8 [; {: C7 s4 F; T* G, x8 u
x.getElementsByTagName("ALBUM")[0].childNodes[0].nodeValue + "</li>" +
% m1 L, n& o4 @ "<li>国家：" +9 [! E- q# I* R. ^" q& y
x.getElementsByTagName("COUNTRY")[0].childNodes[0].nodeValue + "</li>" +
; x9 m$ C) B. B& N6 a, o' y8 m "<li>公司：" +" l0 T4 E& ^! w( \4 i, K5 @, W
x.getElementsByTagName("COMPANY")[0].childNodes[0].nodeValue + "</li>" +
' w* X( C$ h; x) ?0 B "<li>年份：" +
7 {: M5 \ r; [) A x.getElementsByTagName("YEAR")[0].childNodes[0].nodeValue + "</li>" +' b* P4 y r: B5 m7 x
"</ul>";
+ ? Q8 v- o) |1 r; N }, U2 Q4 d( D3 c3 s1 ~- r4 J0 R
* J: [$ @6 h- h9 H" O0 m function loadDoc() { _: C* H+ m; S1 N9 I/ P; R
, h4 q6 M/ I; m. Y* F
document.getElementById("demo").innerHTML = table;; o# [; J5 h# t* F3 R5 z' x1 r$ k
}4 y4 U$ U; H$ ^/ K1 R2 E" X# A3 E4 f
4 O0 ?9 T" u) d$ G </script>
: ?! L9 z8 [( u1 }9 Y* E8 `$ \$ M" e5 n$ d+ D
0 W! h) [5 z: A" X2 z2 a
</body>& `# H6 G! w0 B* A# J
6 J- U2 _3 l6 u, b</html>
$ U& |/ w$ j6 k8 J" T# c
3 E) G2 {+ K/ P; K1 d
$ g$ n) R, d5 X5 r X1 T[/mw_shl_code] Y3 W' s, t7 }
% p& z+ @" v6 A; w$ D" y- P) M9 ^+ M% s! K
5 i. n8 w1 ?- t6 b3 u2 mXML文件
9 U$ G5 s. Y% Y
$ m. Q) h) z' D% [! [) M[mw_shl_code=xml,true]<?xml version="1.0" encoding="utf-8"?>0 u9 D0 e+ p1 o7 q! Y
<CATALOG>% T, v3 Y% h; S4 o _7 o
<TRACK>& m# G6 [$ Q" q$ w& N( P! u
<TITLE>再见</TITLE>6 D( v6 O8 }. v: D0 n/ C% X5 k
<ARTIST>邓紫棋</ARTIST>8 O! X( A; N7 X. }# G- M: k
<ALBUM>新的心跳</ALBUM>) f" W/ J$ ?: M* \: C
<COUNTRY>中国</COUNTRY>
* J' p; |. @1 ?- Q5 {<COMPANY>邓紫棋工作室</COMPANY>
% P) u. ~+ Z7 S* \! o) r" Q<YEAR>2016</YEAR>
9 z1 \6 w+ l4 Z- V8 c7 u& e</TRACK>' V2 S# _, [ _$ o
" [$ }6 e* U& E/ _3 `
<TRACK>; g: }- O3 e/ w
<TITLE>All I Ask</TITLE>
+ v( c, _$ M, z5 p( b9 j9 `, g! U<ARTIST>Adele</ARTIST>
7 Y, p$ C a9 `3 u6 U7 @2 ]9 i4 y<ALBUM>25</ALBUM>4 {3 H) I3 l& m5 O! c! R9 p4 @2 f
<COUNTRY>英国</COUNTRY>: `$ O% Y) p0 O3 Y
<COMPANY>XL Recordings</COMPANY>! T7 D4 y0 k0 w2 c( B1 ~0 k6 B# g
<YEAR>2015</YEAR>
" ]3 b) |7 u5 O</TRACK>. [' l- V" y) C. Z$ G& L/ Y6 B6 S
# p. @5 W5 e8 d6 }0 J; l<TRACK>
5 ~1 i7 Z+ m, X& b& c<TITLE>之乎者也</TITLE>$ Y' ?, D1 E7 I' e
<ARTIST>罗大佑</ARTIST>$ ~5 j$ M( d; j
<ALBUM>青春舞曲</ALBUM>$ w2 O9 I3 ?7 n! @4 i1 B: F
<COUNTRY>中国</COUNTRY>
7 [( ]. B5 J( F2 J<COMPANY>滚石唱片</COMPANY>, U/ `' M) v2 P
<YEAR>1982</YEAR>8 v* R4 A& D5 u/ X7 D2 p5 L3 T
</TRACK>
' e" T* S5 b) v+ F1 _
p6 w. k% v: a, ]1 m* h0 V' L<TRACK>
0 P) Z1 f$ O. y' a( W<TITLE>Never Be Alone</TITLE>. {3 G* v. c/ b6 q( a9 c' m9 K
<ARTIST>Shawn Mendes</ARTIST>
& m* \0 j& k1 j( J6 u: N7 v+ z; [<ALBUM>Handwritten</ALBUM>
' i5 F, o* c( J<COUNTRY>加拿大</COUNTRY>
- _2 k" t: ?; s! k0 i<COMPANY>环球唱片</COMPANY>
# c4 j5 v7 b+ J8 n, m" \0 r<YEAR>2015</YEAR>0 ]% N- P' G- h' m0 y) `
</TRACK>
, K t0 n$ |' ]& n8 b7 u. h! `3 Q" W! g1 e
<TRACK>
: z2 F% ?( m( E. U# @0 }<TITLE>慢慢</TITLE>
: A5 z; {- a" z- z' A; L<ARTIST>张学友</ARTIST>$ H. E- d% T- Y6 j4 C
<ALBUM>忘记你我做不到</ALBUM># a* |: ? g+ u
<COUNTRY>中国</COUNTRY>. d( _3 F9 {0 ~4 Q; r
<COMPANY>环球唱片</COMPANY>1 x3 z4 G9 D' K: m R
<YEAR>1996</YEAR>* C; K1 d6 Y& |6 t: k% V
</TRACK>7 y! O1 Q. M2 t$ _9 f/ _
2 {+ }* l0 ~0 v" w) c6 q
<TRACK>
4 [* C A+ L+ L+ F" ~( D<TITLE>Complicated</TITLE>6 T$ I2 R) A# \, ?
<ARTIST>Avril Lavigne</ARTIST>
* }+ x% g2 r; `) B8 Q<ALBUM>Let Go</ALBUM>
/ F1 z. w6 y+ t7 Q9 `4 U2 W<COUNTRY>加拿大</COUNTRY>! f* ]9 B9 | B# x5 U) X
<COMPANY>索尼音乐</COMPANY>. Q8 O+ `7 g5 b' [( D9 Z: {( y
<YEAR>2002</YEAR>9 I8 N) y0 E. y, j% _& D
</TRACK>
m M0 b: q% \
0 [+ m. y7 j* ?" S, |+ s<TRACK>
9 \9 N$ b0 }/ n5 d3 G7 z( r<TITLE>三生三世</TITLE>
k7 r% V1 v& l5 K$ }6 P<ARTIST>张杰</ARTIST># J" w+ j5 r/ E4 C! i7 n: g
<ALBUM>三生三世十里桃花</ALBUM>
# U: M% k: l+ X' m<COUNTRY>中国</COUNTRY>2 t' R* M# l/ K
<COMPANY>仁溪音乐</COMPANY>4 `8 x1 D! k) S; g, U7 U& G9 n1 ^
<YEAR>2018</YEAR>
; e( C& Z/ I/ L: S# s5 s</TRACK>
! B- I- [8 S8 `2 C2 E( A$ Q ?, ]$ m0 d7 k! E& L. c& E
<TRACK>" i% U- i p5 _3 _
<TITLE>Five Hundred Miles</TITLE> p) Y' a' ~+ H" M& x& Q1 A
<ARTIST>Justin Timberlake</ARTIST>
: a' @; q* d. v4 h' j<ALBUM>Inside Llewyn Davis</ALBUM># s) N" B* J: E2 m8 ~& Q( s
<COUNTRY>美国</COUNTRY>4 R( s1 P: e! H* }2 C+ m
<COMPANY>华纳唱片</COMPANY>
+ V! r. J! ?" u+ c<YEAR>2013</YEAR>
8 o$ ?$ j( F- [* D& z6 W</TRACK>
. r' r3 u2 P, c/ N6 Z+ e. g' I/ }$ z o3 X) `6 U
<TRACK>
9 s1 m) K0 O3 |8 ^<TITLE>演员</TITLE>. g3 A: s% C$ b
<ARTIST>薛之谦</ARTIST>
* [/ m1 `) M- k7 [& m<ALBUM>绅士</ALBUM>+ w+ g0 p! X9 _; Q- X( y' O
<COUNTRY>中国</COUNTRY>2 d# f* @3 ~% n4 p' j
<COMPANY>海蝶音乐</COMPANY>
4 t% K1 }: a2 X# O# p/ x" D. f8 w<YEAR>2016</YEAR>& K4 F4 j5 I/ c* c* C. P
</TRACK>
4 I ?5 D+ S( p) i1 P+ C/ ?1 [- }* x- D) M
<TRACK>
% X' X, g8 G* |<TITLE>Numb</TITLE>
O+ S. e# o; a. K<ARTIST>Linkin Park</ARTIST>
6 {( ^5 K( d( h. _; P- q<ALBUM>Meteora</ALBUM>
! `7 I9 s/ `* }1 ~$ H9 ?/ \9 b<COUNTRY>美国</COUNTRY>* h' m" J+ }: P. M8 Y
<COMPANY>华纳唱片</COMPANY>
# t& u* Z& r, k/ \) }! a<YEAR>2003</YEAR>
/ e+ G2 D# u6 ]. w* q" d( y</TRACK># s# M2 D- G5 X9 i- O; b3 ~
4 |5 q) S( D6 @) `: K<TRACK>( ]. n* L% r/ R( ~ y
<TITLE>给未来的自己</TITLE>0 a* V( S8 T+ v _' P' `& T( O
<ARTIST>梁静茹</ARTIST>
; R$ ^! c' a5 b5 H9 d<ALBUM>崇拜</ALBUM>7 v) _9 m ^# ?; u4 |, }5 v5 I# B
<COUNTRY>马来西亚</COUNTRY>( X' i; h; m( q0 l* J3 x
<COMPANY>相信音乐</COMPANY># I. [) F1 A/ {4 ]# K
<YEAR>2007</YEAR>
9 Q. ` N ?+ N/ k0 A</TRACK>4 e c% F% V+ W8 m$ f
( {& Y2 }6 @0 @! w<TRACK>
m5 N% D" C; B9 E9 t% H8 V# n<TITLE>The Monster</TITLE>
# o# Y/ Y! I( `: D<ARTIST>Rihanna</ARTIST>% g6 A% P$ e9 T* P( {! v/ S
<ALBUM>The Marshall Mathers LP2</ALBUM>
0 V/ H$ A4 G6 G+ i Y" x/ X- P<COUNTRY>巴巴多斯</COUNTRY>, X$ l; ~" K! F, b8 j
<COMPANY>环球唱片</COMPANY>3 K+ Z" y; ]' c9 L
<YEAR>2013</YEAR>
% x# w5 n! b4 B# n8 {$ S( s</TRACK>% \9 y: R6 B) C5 Q w+ ~ ~8 h# ?0 L
) ~* q7 M" O$ i/ S' G9 Q5 ]
<TRACK>* T6 G3 k8 g. _* O: A
<TITLE>我终于失去了你</TITLE>
$ I) K( X5 X- e% J- F6 n<ARTIST>赵传</ARTIST>' y8 i7 r# v7 s/ v: |" T
<ALBUM>我终于失去了你</ALBUM>
, x) G) _# V( g8 M5 T3 ?6 B U# L<COUNTRY>中国</COUNTRY> s; l0 l# U0 n
<COMPANY>滚石唱片</COMPANY>! G: S3 l% e+ _. Z9 o
<YEAR>1989</YEAR>3 N: U4 p! I( C5 e5 C* P
</TRACK>
9 D0 N6 }5 l' y P' w/ ?
8 u0 i9 P. x. n# }, M' Z9 U+ Y& N$ E2 q<TRACK>
, q1 h) M W/ ~4 J2 }! a3 M* y<TITLE>Main Titles</TITLE>, C% ]5 S7 t, _" c9 x) @' V
<ARTIST>Ramin Djawadi</ARTIST>4 U) l2 ^0 c0 O: w6 v
<ALBUM>Game of Thrones</ALBUM>) Z7 l, @4 h3 s' x1 e" u
<COUNTRY>德国</COUNTRY>
3 y& \# O; o, L# A1 G4 n5 s<COMPANY>索尼音乐</COMPANY>4 e7 o5 C7 t8 n
<YEAR>2011</YEAR>
3 L$ Z9 @* _% N4 p, D7 V</TRACK>: M* _9 x" w2 y) a$ a& [
0 P# a$ s ^ b( Q9 A<TRACK>
( D# y4 ^9 f4 Y; E& `<TITLE>传奇</TITLE>
- M; D* g* p1 T2 _! B p7 T<ARTIST>李健</ARTIST>; }1 r( }* a, H
<ALBUM>似水流年</ALBUM>8 u2 L( f; G: Z& B/ S7 a
<COUNTRY>中国</COUNTRY>
5 V$ J) Y, L7 m/ O+ R& t" K<COMPANY>北京完美坚持文化艺术工作室</COMPANY>
' T7 Z% r1 R) l+ }3 o4 [8 \5 A# D<YEAR>2003</YEAR>
; _) h$ Y. ~1 i+ `</TRACK>
- o& _9 y8 K( e3 K( `' ~" m! V
1 t- S8 ^6 a- I) _% s<TRACK>
8 @/ g0 t5 @1 K: F& h<TITLE>完美生活</TITLE>$ i* O) C- \ R; [" w
<ARTIST>许巍</ARTIST>
& B3 O# s& n6 D, l& a<ALBUM>时光漫步</ALBUM>
4 G0 B6 }) W0 c& k<COUNTRY>中国</COUNTRY>
1 w+ g) o9 I& f<COMPANY>金牌大风</COMPANY>3 B% l+ w; ?0 a$ C' Q# _
<YEAR>2002</YEAR>
6 G3 Q/ o8 R; F$ x7 a</TRACK>
) Z+ f6 E' k4 d6 E4 o</CATALOG>[/mw_shl_code]4 J7 {" b( ^7 |$ j3 r- D* y
|
|
|小黑屋|手机版|PLM之家-企业数字化转型工业软件学习平台
