Hamamatsu.rb #12 20120208

1. お父さんのための 実用 JavaScript プログラミング ～入門篇～ @cherenkov 2012 2/8 hamamatsu.rb #12

3. 実用JavaScriptとは？

4. ユーザースクリプトとは？

5. ユーザースクリプト紹介

6. 習得方法

7. まとめ

8. @cherenkov

9. @cherenkov

10. @cherenkov

11. @cherenkov

14. XSSハンター

15. XSSとは 悪意を持ったユーザがフォームなどを通してJavaScriptなどのスクリプトコードを入力した時に、プログラム側に適切なチェック機構がないと、そのスクリプト内容がそのままHTMLに埋め込まれ、ページを閲覧したコンピュータでスクリプトが実行されてしまうことがある。 IT用語辞典より

26. XSSハンター

33. duplicate twitter followers Twitter ユーザ同士の重複したフォロワーを数える

37. duplicate twitter followers Twitter ユーザ同士の重複したフォロワーを数える

38. croppi! 画像を任意のサイズに楽ちんクロップ

42. duplicate twitter followers Twitter ユーザ同士の重複したフォロワーを数える

43. croppi! 画像を任意のサイズに楽ちんクロップ

44. お父さんのための 実用 JavaScript プログラミング ～入門篇～

45. 実用JavaScriptとは？

50. 実用JavaScriptとは？

52. 実用JavaScriptとは？ 業務効率大幅アップ！ お父さんのための“生活に役立つツール” さまざまなスクリプトを書いて、 キャリアアップを目指そう

54. ブックマークレット（”お気に入り”のURLにスクリプトを仕込む javascript:～）

57. どうすればいいの？？

62. スクリプトの自動実行

63. データの永続化

64. クロスドメイン通信(Web APIが使える)

65. メニューコマンド追加

66. クリップボードへコピー(*)

70. cherenkovが作ったもの wikipedia - image plus

71. cherenkovが作ったもの github charcode converter

72. cherenkovが作ったもの google docs chat notification

73. cherenkovが作ったもの Togetter - Who's tweeting?

74. cherenkovが作ったもの Twitter - Undo tweet

75. cherenkovが作ったもの gist.github - display file name

76. // ==UserScript== // @name gist.github - display file name // @namespace http://d.hatena.ne.jp/Cherenkov/ // @include http://gist.github.com/* // @include https://gist.github.com/* // @version 0.2 // @date 20110305 // ==/UserScript== function disp(doc) { Array.forEach(doc.querySelectorAll(".meta .info a:first-child"), function(e) { var id = e.href.replace(/^https?:gistgithubcom/,""); GM_xmlhttpRequest({ method: "get", url: "http://gist.github.com/api/v1/json/" + id, headers: {"User-Agent":"Mozilla/5.0", "Accept":"text/xml"}, onload: function(res) { var gists = JSON.parse(res.responseText).gists[0]; var fileName = document.createElement("span"); fileName.style.fontStyle = "italic"; fileName.appendChild(document.createTextNode(gists.files.join())); e.parentNode.parentNode.insertBefore(fileName, e.parentNode.nextSibling); } }); }); } if(!document.getElementById("repos")) { disp(document); document.addEventListener("AutoPagerize_DOMNodeInserted", function(evt) { disp(evt.target); }, false); }

82. DOM element リファレンス

86. DOM element リファレンス

90. DOM element リファレンス

92. Try & Error 超重要

94. ChromeユーザもまずはFirefox + Greasemonkeyで動作確認してから

95. ユーザースクリプトのエラーなどは「エラーコンソール」に出力されるっぽい 本来エラーなどは、 Firebug コンソールの表示設定で 「クロームのエラーを表示」 「クロームのメッセージを表示」を有効にすれば こちらに表示されるはず。バグかも。

97. ユーザースクリプトを通して技術や知識を養い業務に応用することも可能。

98. 1クリックする手間を省き効率よくブラウジングしよう。