jQuery 開発者向けメモ - 基本・サンプル
基本 jQueryとは jQuery は様々な処理を短く簡単に書ける JavaScript ライブラリです． 独自のXPATH/CSSセレクタを利用することで，多くのDOM操作を非常に簡単に書くことが出来ます． JavaScriptのDOM操作や，XMLHTTPRequest，XMLの操作などを覚えなくとも， Ajaxを利用したインタラクティブなページを作ることが出来ます． 以下のサンプルを見れば，JavaScriptらしい表記をほとんどする必要がないことがわかると思います． toggleサンプル 特定のブロックの表示・非表示を切り替えるのは以下のようなコードになります． $("#target_toggle").toggle("slow"); このブロックは，<p id="target_toggle"> です． Ajaxサンプル Ajaxでhello.htmlをロードするのは以下のようなコ
Firefoxの必須拡張と設定カスタマイズ集 - 『ちよろず。』
■[Firefox][Lifehack]Firefoxの必須拡張と設定カスタマイズ集 Firefoxは、磨くとより一層光る玉という感じで、カスタマイズしてナンボなところがあるのが素敵です。IE 7 Betaも検証してみましたが、RSSリーダー機能が標準で搭載されている点以外については、機能面・使い勝手共にカスタマイズ後のFirefoxに軍配が上がります。暫くは僕の中でのFirefox優位には変わりがなさそうです。 さて、というわけで今日は僕がインストールしているFirefoxのExtentionと、カスタマイズ内容を書こうと思います。有名なものばかりなので、あまり目新しい情報はありませんが、かなり便利になると思うのでよかったら使ってみてください。 ちなみに、Firefoxそのもののバージョンは1.5.0.1をベースにしています。 Firefox Extensionの紹介 All-in-On
Greasemonkeyで快適Web生活
分裂勘違い君劇場 - 思考の速度でパソコンを使う技術 を見て触発されたので自分の設定をまとめてみる。 片手でネットサーフィン ブラウジングの基本的な動きを右手に集中させることによって片手でネットサーフィンを行うことを目指している。 livedoor Readerでのキー配置 J::次の記事（ 最速インターフェース研究会 ::Google readerみたいにj/kだけで全部読みたい） K::前の記事（ 最速インターフェース研究会 ::Google readerみたいにj/kだけで全部読みたい） H::はてブコメントを表示（UserJS Mania: [更新]livedoor Readerにはてなブックマークのコメントを表示する) N::元記事を表示（自分でちょこっと変更） Y::youtubeを表示（antipop - Update: LDR で最速動画ウォッチング + YouTube A
Safari の JavaScript の不備 Days on the Moon
ぱっと見はいいんだけど細かいところでちょこちょこ穴があるような気がする Safari (というより Apple WebKit) ですが、どのような穴がいつふさがれてきたのかまとめてみました。最初は JavaScript 関係だけ調べるつもりだったのですが Safari 2.0.3 で setSelectionRange がサポートされたというのを聞いたのでそっちのほうも少し。ただし、手元に Mac 環境がないので実際に Safari で試したわけではありません。すべてソースと変更履歴から推測しただけなのでそのつもりで。 下の表で「WebKit」というのはその機能が実装された WebKit の (正式公開) バージョン、「Safari」というのはそのときの Safari のバージョンをあらわしています。「-」はその機能が現時点 (Safari 2.0.3) でも未実装ということです。「-」は
JavaScriptにおける繰り返し - 実用
JavaScriptにおける繰り返し 翻訳 原文：from __future__ import * >> Iteration in JavaScript 著者：Bob Ippolito JavaScriptには、基本的は2種類のオブジェクトの繰り返しがある。 すべてのオブジェクトはプロパティの列挙をサポートしている。 for (var propName in someObject) { var value = someObject[propName]; } "Arrayプロトコル"をサポートするオブジェクトもある。 for (var i=0; i<someObject.length; i++) { var value = someObject[i]; } どっちも、ひどい。 プロパティの列挙はデバッグぐらいしか使い道がない。何故なら、列挙の中では興味のないプロパティにたくさん遭遇するくせに
inforno Blog Archive 埋め込みjavascriptを実装してみました。
naoyaさん のJemplateの記事に触発されて埋め込みjavascriptを実装してみました。 同様の実装として Ajax Pages があるのですが、よりシンプルに実装してみました。コードにして50行。 サンプルファイルダウンロード これは今作っているフレームワークの一部です。シンプルですがわりと使えるかと。 実際の動作はサンプルファイルを見ていただくとして lyase_view.jsの説明どおり 1/* 2 * using innerHTML 3 * ------------- 4 * //in HTML 5 * <textarea id="template" style="display:none"> 6 * The value of x is:< %= context.x%> 7 * </textarea> 8 * //code 9 * document.write(Lyas
www.horaguchi.net - やはり IE6 では列挙されないようだ。
やはり IE6 では列挙されないようだ。 Object.extend = function (obj, add) { for (var i in add) { obj[i] = add[i]; } // to extend overridden DontEnum property (IE, NS) [ 'eval', 'hasOwnProperty', 'isPrototypeOf', 'propertyIsEnumerable', 'toLocaleString', 'toSource', 'toString', 'unwatch', 'valueOf', 'watch' ].forEach(function (key) { if (add.hasOwnProperty(key)) { obj[key] = ad
最速インターフェース研究会 :: Safariでreplace callback のエミュレーション
replaceメソッドをhackしてsafariでもreplace callbackを使えるようにしてみた。Safari バージョン 2.0.2（416.13）で上手く動いたそうです。手元に環境が無いので細かい検証はできませんが、とりあえず。 http://la.ma.la/misc/js/replace_callback/ 解説JavaScriptのString#replaceメソッドは文字列を置換して新しい文字列を返すメソッドですが、第二引数に置換後の文字列を指定する代わりにfunctionオブジェクトを渡してやると、Perlでいうところのeオプションみたいなことができます。 // 大文字を小文字に、小文字を大文字に String.prototype.swapcase = function(){ return this.replace(/([a-z])|([A-Z])/g,functi
激しく誤差の範囲内の予感 - f99aq8oveのブログ
追記 safari だと replace に関数を渡せないらしいです。 replace に関数指定しない方が良いよ escapeHTML をぐるぐる回してみた 俺のあれは数年前から停滞してるので、かっこいい人の登場を待ちます。。。 関数そのまま使いましたm(__)m 眠い。 escapeHTML の実装 3 パターン (ベンチマーク付き) - (new Hatena).blog() window.onload = function () { bench(escapeHTML_replace_multi, "replace_multi"); bench(escapeHTML_replace_func_rulescached_regexcached, "replace_func_rulescached_regexcached"); bench(escapeHTML_replace_func_r
escapeHTML の実装 3 パターン (ベンチマーク付き) - (new Hatena).blog()
ウェブを扱うライブラリやプログラムで必ずと言って良いほど見かけるものに、escapeHTML という関数があります。 "&" 等、特別な意味を持つ文字を、表示等のために実体参照 (&) に変換するお決まりの関数なんですが、実装には色々とバリエーションがあるものです。 1. String#replace メソッドを繰り返す (MochiKit 等) function escapeHTML(str) { return str.replace(/&/g, "&").replace(/"/g, """).replace(/</g, "<").replace(/>/g, ">"); }このパターンが最も多く見受けられます。Ruby でも同様に gsub を繰り返す方式を見かけることがあります (例: RSS::Utils.html_escape)。 2. Str
拡張機能リンク & 索引 - 「Firefoxを究める256のテクニック」サポートページ
拡張機能リンク & 索引 数字/記号 A B C D E F G H I J K L M N O P R S T U V W X Y Z 日本語 頭文字名前種類書籍掲載ページ 数字/記号 2 Pane Bookmarks 拡張機能 106 2ch URL Modify 拡張機能 349 A A9 Toolbar for Firefox 拡張機能 179 AdBlock 拡張機能 226 AdBlock（日本語版） 拡張機能 226 Advanced Search Sidebar 拡張機能 205 All-in-One Gestures 拡張機能 158 All-in-One Menu 拡張機能 251 All-In-One Search button 拡張機能 210 All-In-One Search button（ミラー） 拡張機能 192 All-In-One Sidebar 拡張機
Leak Monitor Extension
This extension is no longer maintained and would take significant work to get working again. Summary This Firefox extension detects one very specific type of memory leak in chrome JavaScript and in Web pages. (Not in JavaScript components, though.) It detects when JavaScript objects in the chrome or Web page are still held by native code after the window is closed. It notifies the user after the f
川o・-・）＜2nd life - Firefox 2.0 Beta 1 で Rails のドキュメントをインクリメンタルサーチ
先日、Firefox の Beta 1 がリリースされました。で、2.0 の新機能の一つで、OpenSearchを利用した検索プラグインを個人でも簡単に作成することができるようになりました。また A9.com > OpenSearch > OpenSearch Autodiscovery を利用すると、2クリックで簡単に閲覧しているサイトを検索プラグインとして Firefox に追加することができます。 で、Creating MozSearch plugins - MDCを読んでいたら、JSON でデータを返すと google suggest のようなインクリメンタルな検索結果を表示できるようです。面白そう！ということで早速 api.rails2u.com にOpenSearch Autodiscovery と 検索結果を JSON で返すAPIを仕込んでインクリメンタルサーチするようにし
un-q.net - このウェブサイトは販売用です！ - un q リソースおよび情報
This webpage was generated by the domain owner using Sedo Domain Parking. Disclaimer: Sedo maintains no relationship with third party advertisers. Reference to any specific service or trade mark is not controlled by Sedo nor does it constitute or imply its association, endorsement or recommendation.
窓の杜 - 【NEWS】フェンリル、Webページを画像キャプチャーできる「Sleipnir」プラグインを公開
フェンリル（株）は13日、閲覧中のWebページ全体をPNG画像としてキャプチャーできる「Sleipnir」用プラグイン「SnapCrab」v1.0.0を公開した。Windows上の「Sleipnir」に対応するフリーソフトで、編集部にてWindows Vista上の「Sleipnir」v2.5.17で動作確認した。現在、「Sleipnir」の専用サイトからダウンロードできる。 「SnapCrab」は、「Sleipnir」にWebキャプチャー機能を追加できるプラグイン。本プラグインをインストールすると現れるツールバー上のボタンを押すだけで、閲覧中のWebページ全体や、現在表示している領域をPNG画像として保存できる。さらに、マウスのドラッグで矩形選択した範囲内のみをキャプチャーすることも可能。 キャプチャーした画像はデスクトップなどへ自動で保存される仕組みで、画像を保存したフォルダをメニュー
ニコニコ動画のFLV, コメントをダウンロード＆コメントをその場で表示できる GreaseMonkey スクリプトとりあえず暇だったし何となく始めたブログ -
一応, プレミア対応できた？かな. テストが全然足りてないけど, これはしょうがない. ダウンロード http://www.oti-orz.mydns.jp/~khiker/file/20070915/nicoflvcomment.user.js http://www39101u.sakura.ne.jp/~kiyoto/javascript/greasemonkey/nicoflvcomment.user.js # DL できるサイトを移転しました。それに応じてスクリプトの名前も変更したので、 # 以前のバージョンを入れている方は一旦削除してから新しいバージョンを入れた方が良いと思います。 # ただし、スクリプトに大きな変更はありません。 機能 ニコニコ動画の http://www.nicovideo.jp/watch/ 以下の URLで動作する GreaseMonkey スクリプトです
Vimでファイル保存時にFirefoxをリロードする(with MozLab) - 2006-10-05 - WDF
この記事(http://la.ma.la/blog/diary_200609280045.htm)を参考に、MozLab(http://dev.hyperstruct.net/trac/mozlab)のMozReplを使って、Vimでファイル(*.html,*.htm,*.js,*.css)保存時にFirefoxをリロードするVimスクリプトを作ってみた。 :SetreloadfirefoxでVimでファイルを保存するたびにFirefox(MozReplを開始しておく)がリロードされます。 もう一度:Setreloadfirefoxと入力すると解除されます。 ※rubyが必要です。 ※perl, python を使ったスクリプトを公開しました。Vimでファイル保存時にFirefoxをリロードする(with MozLab) : Serendip - Webデザイン・ホームページ制作 demo
配列のループ - FAX
配列のループ イディオム (in behaviour.js) 以下は、 for(var i = 0; i < list.length ; i++){ var element = list[i]; alert(element); } 以下のように書ける。 for (var i = 0 ; element = list[i] ; i++){ alert(element); } 「forが多いコードは、ダメなコード」という思いもある。 追記 id:facetさんにブックマークコメントを頂き、カウンタ変数の宣言にvarを追加した。 varをつけない場合、変数はグローバル変数として扱われる。 (function(){ for(i=0 ; i<3 ; i++){} })() // カウンタ変数へ参照可能 ok(i == 3); varをつけると、変数は「関数スコープの中の変数(forなど、ブロックの中
Bookmarklet Builder
Bookmarklet name: Rows: Help for Bookmarklet Builder Javascript code: javascript: Wrap text (Bookmarklet)
HTML、簡易表記、Wiki - FAX
HTML、簡易表記、Wiki JavaScript, リンク 2007/6/15 最終更新 Control.TextArea : Cross Browser TextArea Manipulation Wiki.Formatter in JavaScript WikiParser.js WikiParser.js Pure JavaScript Wiki Like Formatter Wiki on a Stick Wiky: A Bidirectional Markup Converter pukiwikiparser.rbをJavaScriptに移植してみた(管理人日記) - むぅもぉ.jp TiddlyWiki GTDTiddlyWiki text-hatena.js Showdown - Markdown in Javascript js-markdown-extra js-mar
Javascript Shell bookmarklet for IE · Curiosity is bliss
Javascript Shell bookmarklet for IE 19 Apr 2006 The Javascript Shell is an awesome utility for javascript development. It was written by Jesse Ruderman and some other contributors. The bookmarklet version is the most useful, but it unfortunately only works in Firefox. Here is an updated version which brings some love to IE developers: Javascript Shell for IE bookmarklet. You might run into issues
最速インターフェース研究会 :: JavaScriptで出現回数のカウントをする際のコード
今までこう書いてたのが count[key] = count[key] ? count[key] + 1 : 1; こう書けることが判明した。 count[key] = ++count[key] || 1; コメント欄への回答 count[key]がNumberまたはundefinedであるとして、個人的には count[key] = (count[key] || 0) + 1; のほうが好みです。 JavaScriptでは問題ないとはいえ、言語によってはi = ++iの動作が未定義だったりするので。 前者の書き方とこの書き方は実は問題があって、Object.prototypeに定義されてるメソッドとハッシュのキー名がかぶるとおかしくなる。なので本当はcount.hasOwnProperty(key)でチェックするのが正しいのだけれど、出現回数のカウントごときでメソッド呼び出しとかしたくな
JavaScriptにBlogの全文検索をやらせてみるテスト
JavaScriptでBlogの本文から検索します。タイトルは含んでません(手抜き) ひらがなカタカナはローマ字のまま検索できます。
最速インターフェース研究会 :: 実践JavaScriptリファクタリング、その2
連載すんの？ リファクタリングとか嘘で実は実践ビルトインオブジェクトハックなんだけど。 例題 配列 a = [3,5,4,2,1] から一番小さな値と、一番大きな値を取り出すにはどうすればいいか。 多分昔はこんな風に書いてたと思うんですよ。 a = [3,5,4,2,1]; for(i=0;i<a.length;i++){ if(i == 0){ min = a[0]; max = a[0]; } if(min > a[i]){min = a[i]} if(max < a[i]){max = a[i]} } 模範解答として、後先考えないやり方を提示しておく。 a = [3,5,4,2,1]; min = a.sort().shift();// 1 max = a.sort().pop(); // 5 短い。ただし、これをやるとaの内容は並べ替えられて最初と最後の要素が取り除かれる。 a /
最速インターフェース研究会 :: 実践JavaScriptリファクタリング
同じ事をやるにも、いろんな書き方があるわけでいかにして短くてわかりやすいコードを書くかというノウハウを紹介します。 例として"abcde"を80回繰り返した文字列を作るとして実際に自分のコーディングスタイルがどんな風に変化していったのか、という。 短くなるのは確かなんだけどわかりやすいかというと、人によるかもしれない。 グローバル関数を定義2年前なら、多分こういう具合だった。 //ふつうに関数として定義する function x(str,num){ var tmp = ""; for(var i=0;i<num;i++){ tmp += str; } return tmp; } x("abcde",80) Stringのメソッドとして定義1年前だとこんな感じ。 //Stringのメソッドとして定義する String.prototype.x = function(num){ var tmp
Firebug
Thank you, Firebug. You made the web amazing for all! The story of Firefox and Firebug are synonymous with the rise of the web. We fought the good fight and changed how developers inspect HTML and debug JS in the browser. Firebug ushered the Web 2.0 era. Today, the work pioneered by the Firebug community through the last 12 years lives on in Firefox Developer Tools. Switch to the latest version of
JavaScript 用デバッグコンソール "IEerBug" [tech.nitoyon.com]
IEerBug は Internet Explorer 6.0 と FireFox 1.5 で動く JavaScript 用のデバッグ コンソールです。 FireBug と同じ console.log()、console.debug() などの関数が使えるようになるため、FireFox と IE の両方でデバッグする場合に便利です。コンソールに出力したオブジェクトを、DOM インスペクタを利用して解析することも可能です。 使い方 ieerbug.zip をダウンロードし、中身をアプリケーションのディレクトリに配置します。IEerBug 用のディレクトリを作成して、その中に配置しても問題ありません。 HTML の中で次のようにして ieerbug.js を読み込みます。
![JavaScript 用デバッグコンソール "IEerBug" [tech.nitoyon.com]](https://cdn-ak-scissors.b.st-hatena.com/image/square/95abde13f7ed41248843e654a2f2ddcde8983db4/height=288;version=1;width=512/http%3A%2F%2Ftech.nitoyon.com%2Fapple-touch-icon-114x114.png){kind=icon}
GreaseMonkey Script on Opera 9.00 < 21 < June < 2006 < nulog, NULL::something : out of the headphone
9.0 がリリースされたのでいろいろ調べて書く。 XPath は割と普通に使えるっぽい。時々変な挙動な気もするけど。$X は書き換え無しに動く。と思いきや createNSResolver は動かない innerHTML 使ってパースさせるやつ は Opera でもできるようだ。 Array#forEach や GM_xmlhttpRequest がないため、殆どの GreaseMonkey スクリプトは動かない (が、後述するスクリプトでほぼ解決)。ついでに Opera はハイパートリッキーなことをしないとドメインを超えられないようだ。 Opera 用のラッパは 000.user.js とか最初のほうに呼ばれそうなファイルに書いてあげればいいっぽい。000.user.js . インターフェイスのラッパだけです。ドメイン超えるのも 000.user.js に書けば普通にいけるかもしれない。
cc-mode (Emacs20 info)
cc-mode on Emacs20 2000/10/30 backward-listとforward-listの説明が逆になっていたのを修正。 ヴァージョンの確認 次のヴァージョンで動作確認しています。 Emacs20.3 - Emacs20.7 M-x versionとタイプすると、ミニバッファにEmacs 20.3.1のように表示されます。 最後の"1"は、ローカルでmakeした回数なので関係ありません。 cc-mode 5.21 M-x c-versionでミニバッファに表示されます。 cc-modeとは EmacsのCプログラミング用のモードです。 C以外にも、C++、Objective-C、Java、CORBA IDLをサポートしています。 Emacs20では、標準のCモードです。 昔からあるc-modeは、cc-modeのinfoによれば、"Boring Old C Mode
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
http://www.asahi-net.or.jp/~xe4r-kmt/other/jsh_demo_20061014.htm
JavaScript++かも日記/Ajax,Google Maps,etc...
?D of K