Re: [問題] 隨機讀取資料可以如何製作

看板Ajax作者 (愁痕飄絮)時間16年前 (2008/05/02 18:52), 編輯推噓2(203)
留言5則, 3人參與, 最新討論串2/2 (看更多)
我用第二個方案,看看是不是你要的。 http://0rz.tw/e345k 以下為騙P幣用,可能會打錯字... css: <style type="text/css"> ul {width:300px;} ul li { border:1px solid #666; list-style:none; margin-bottom:1em; overflow:auto; } ul li img {float:left;} </style> javascript: <script type="text/javascript">/* <![CDATA[ */ (function(){ var webSites = [ { 'link': 'http://www.google.com', 'img': 'http://osdc.tw/osdc2007/GLogo.png', 'text': 'Google' }, { 'link': 'http://tw.yahoo.com', 'img': 'http://tw.i4.yimg.com/i/tw/hp/spirit/yahoo_logo.gif', 'text': 'Yahoo' }, { 'link': 'http://www.stu.edu.tw', 'img': 'http://freebsd.stu.edu.tw/~ychsiao/stulogo.png', 'text': '樹德科技大學' }, { 'link': 'http://ptt.cc', 'img': 'http://images.ptt.cc/ptt.jpg', 'text': '批踢踢實業坊' }, { 'link': 'http://www.openfoundry.org/', 'img': 'http://osdc.tw/osdc2008/OSSF_logo.gif', 'text': '自由軟體鑄造場' }, { 'link': 'http://g.veryxd.net/', 'img': 'http://farm3.static.flickr.com/2222/2278870558_e75eaea699_o.png', 'text': 'Very XD' } ]; var shuffle = function(){ var i = webSites.length; while ( --i ) { var r = Math.floor( Math.random() * (i+1) ); var tmp = webSites[r]; webSites[i] = webSites[r]; webSites[r] = tmp; } }(); var createEl = function(elName) { return document.createElement(elName); }; var ul = createEl('ul'); var limit = 2; for ( var i = 0; i < limit; ++i ) { var li = createEl('li'); var a = createEl('a'); var img = createEl('img'); var p = createEl('p'); a.href = webSites[i].link; img.src = webSites[i].img; p.innerHTML = webSites[i].text; li.appendChild(a); li.appendChild(img); li.appendChild(p); ul.appendChild(li); } document.getElementsByTagName('body')[0].appendChild(ul); })(); /* ]]> */</script> -- ※ 發信站: 批踢踢實業坊(ptt.cc) ◆ From: 210.71.11.70

05/03 19:43, , 1F
這篇文章值47銀
05/03 19:43, 1F

05/03 19:45, , 2F
複製貼上是騙不到P幣的唷
05/03 19:45, 2F

05/03 19:51, , 3F
我知道呀, 所以只有JSON資料那邊是用貼上的而已~
05/03 19:51, 3F

05/07 08:13, , 4F
非常感謝唷~不過我資質駑鈍,想在兩項中間加一條線,不知道
05/07 08:13, 4F

05/07 08:14, , 5F
不知道可以怎麼加並寫進它的css >"<
05/07 08:14, 5F
文章代碼(AID): #186l9O5S (Ajax)
文章代碼(AID): #186l9O5S (Ajax)