[B! JavaScript][jquery] hamacoのブックマーク

jQueryとSizzleの関係について - console.lealog();

事の発端。 jQueryの使わない機能があまりに多いのでカスタムビルドすることにした Sizzleも外せることを知る(容量がgzipで20KB分くらい減る) 外すと何が変わるか気になる <- いまここってなモチベーションで調べた一連の内容です。 jQueryとSizzleの関係あらためて一応。「jQueryといえば」な以下のようなコード。 var $hoge = $('#hoge'); // こういうのとか var $fuga = $('.fuga'); // こういうのとか $hoge.find('.foo'); // こういうのとか $hoge.text(); // 実はこういうのもそう、いわゆるこのセレクタの実態がSizzleなのです。正確にはもう少し他のメソッドにも関係があります。 jquery/sizzle で、そのSizzleがjQueryの中でどういう動きをしてるか

hamaco 2015/01/14

リンク

history.pushStateでページ遷移するjQueryプラグイン書いた - Webtech Walker

history.pushStateでのページ遷移をやりやすくするためにjQueryのプラグインとしてjquery.smarthistory.jsというのを書いてみました。 jquery.smarthistory.js history.pushStateをサポートしてるブラウザではhistory.pushStateを使って、サポートしてないブラウザでは何もしません（普通に遷移する）。今だとchrome、safari、iOS、Firefox4で動くと思います。こんな感じで使います。 $('a').smarthistory({ defaultData: $('html').html(), target: function() { return $(this).attr('href') }, before: function() { // ajax前の処理 }, change: function

hamaco 2011/02/25

リンク

8行でjQueryのデバッグが楽になるjQuery.pの紹介 - KAYAC Engineers' Blog

週末はオレ標準JavaScript勉強会のUstreamを眺めてました。ago（@kyo_ago）です。以前jQuery使いが陥りやすい罠の中で「4 何でも一行で書こうとする」という点を上げたのですが、以下のようなmethodを定義することでmethod chainのデバッグが楽になるので紹介したいと思います。 $.fn.p = function (id) { var arg = [this]; if (id) arg.unshift(id); if (!window.console) return this; var c = window.console || { 'log' : function () {} }; (c.debug || c.log).apply(c, arg); return this; }; 具体的な使い方ですが、以下のように確認したいmethodの後に.p()を

hamaco 2010/07/31

リンク

Prototyperに贈るjQuerystからの手紙

先に別にどっちがいいという話ではないです。向き不向きはありますが、どちらもフレームワークとしての完成度は高いです。（Prototype.jsも1.6.0でDOM Readyサポートしたし）先に具体的には以下のような使い分けがおすすめ Prototype.js 速度が要求される演算複雑なアルゴリズムを使用した計算他のクラスを拡張した処理（google mapsとか） jQuery 簡単なDOM操作イベント処理ブログパーツ

hamaco 2010/03/26

jQueryとprototype.jsの比較。 OperaShowで見れるよ

リンク

jQuery1.4の新機能を1.4だけに14個 - KAYAC Engineers' Blog

時が経つのは早いもので、ぼーとしてたらもう1月も終わりそうですね。外村です。先日リリースされたjQuery1.4で新しく追加されたメソッドや新しい使い方ができるようになった機能を全部ではないですがいくつか紹介します。以下に変更点が全て掲載されているのでそちらも参照するといいと思います。 Version 1.4 ? jQuery API 新規で追加されたメソッド 1. nextUntil()、prevUntil()、parentsUntil() 指定したセレクタまでの要素を返します。以下の例ではit em3とit em4の後ろにテキストが追加されます。 <ul> <li id="it em1">it em1</li> <li id="it em2">it em2</li> <li id="it em3">it em3</li> <li id="it em4">it em4</li> <li id="it em5