Recommended
More Related Content
What's hot
What's hot (20)
Similar to はじめてのモバイルウェブアプリ 2
Similar to はじめてのモバイルウェブアプリ 2 (20)
More from Taisuke Fukuno
More from Taisuke Fukuno (20)
はじめてのモバイルウェブアプリ 2
- 10. 動かしてみる <!DOCTYPE html> <html><head><title>JS</title> <script> onload = function() { alert(“ABC”); } </script> </head><body> </body></html>
- 14. タグを作る <!DOCTYPE html> <html><head><title>JS</title> <script> onload = function() { var div = document.createElement("div"); div.innerHTML = “鯖江”; document.body.appendChild(div); } </script> </head><body> </body></html>
- 16. CSSとの組み合わせ <style> #t1 { color: #f00; } </style> <script> onload = function() { var div = document.createElement("div"); div.innerHTML = "鯖江"; div.id = "t1"; document.body.appendChild(div); } </script>
- 18. ボタン <script> add = function(s) { var div = document.createElement("div"); div.innerHTML = s; div.id = "t1"; document.body.appendChild(div); } </script> <body> <button onclick=‘add(“鯖江”)'>オス</button> </body>
- 21. ユーザ関数 add = function(s) パラメータ付の関数 add を作る add(“鯖江”) という形で呼び出す test = function(n, m, l) など パラメータ数は増やせる
- 24. jsonp関数を作る jsonp = function(url) { var script = document.createElement("script"); script.setAttribute("src", url); var head = document.getElementsByTagName("head")[0]; head.appendChild(script); }
- 25. Twitter検索関数 twget = function() { var tag = '鯖江'; var url = "http://search.twitter.com/search.json"; jsonp(url + "?callback=tw&q=" + encodeURI(tag)); } ※詳細な仕様はこちら http://apiwiki.twitter.com/Twitter-Search-API- Method%3A-search
- 26. 検索結果表示関数 tw = function(data) { for (var i = 0; i < data['results'].length; i++) { var twi = data['results'][i]; add(twi['from_user'] + ": " + twi['text']); } }
- 27. 呼び出し部分 <!DOCTYPE html><html><head> <script> add = function(s) 略 jsonp = function(url) 略 twget = function() 略 tw = function(data) 略 </script> <body><button onclick='twget()'>オス</button></body> </html>
- 31. 完