2014年10月5日 星期日

高雄前端社群 #13

今天是高雄前端社群的一個workshop,內容是 柯P野生官網的API使用,貼一下jQuery使用get來取得json內容的程式碼:


Javascript (jQuery):
   var kp = {};
    kp.category = "http://api.kptaipei.tw/v1/category/";
    kp.token = "accessToken=kp540eb38fc4fe13.99451521";
    var url = kp.category + "?" + kp.token;

$(function(){
$.get(url, function(res){
for (var index in res.data) {
console.log(res.data[index].name);
           
var html = '
' +res.data[index].name +'
'; $('.container').append(html); } }, 'json'); }); //api key=kp5430b05ac0eec9.99861531
HTML:
<!DOCTYPE html>
<html>

<head>
 <meta charset="utf-8">
    <script src="//code.jquery.com/jquery.min.js"></script>
    <link href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
    <script src="//maxcdhttps://docs.google.com/presentation/d/1Z3w8SdwhS1c4SXM8cdp-oV59FNkz1v79UyhXfYOJ4c0/edit#slide=id.pn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
</head>

<body>
    <div class="container"></div>
</body>

</html>


聽完上午我就先走了...




參考:
今日簡報: https://docs.google.com/presentation/d/1Z3w8SdwhS1c4SXM8cdp-oV59FNkz1v79UyhXfYOJ4c0/edit#slide=id.p
Hackpad: https://hackpad.com/13-PAPIworkshop-uU3qyoHuwzU
JSBin: http://jsbin.com/toxewosedava/1/edit
前端懶人包: https://docs.google.com/document/d/13nK_XY9u5uIleTpSCw88lMupzgCSwXd6j6je44eLhMQ/edit

沒有留言:

張貼留言

© ERIC RILEY , 自由無須告知轉貼
Background Japanese Sayagata by Olga Libby