メモ。
div {
width: 22% \9; /* IE6 IE7 IE8 */
*width: 22% /* IE6 IE7 */
_width: 22% /* IE6 */
}
div:not(:target) {
width: 22% \9; /* IE9 */
}
bootstrapをいじってた時にこういった記述がちらほら目に入ったので調べてみた。
IE9のみのハックは要素の擬似クラスに「:not(:target)」を指定してやるのがポイント。
まずは結論。上から順に高速。
$('#hoge'); // IDセレクタ
$('div'); // タグセレクタ
$('.hoge'); // クラスセレクタ
$('#hoge').find('.hoge'); // IDセレクタ + find()、クラスセレクタ
$('.hoge', '#hoge'); // クラスセレクタとIDセレクタ
$('#hoge').find('div.hoge'); // IDセレクタ + find()、タグ、クラスセレクタ
$('#hoge .hoge'); // ID、クラスセレクタ
$('[name="hoge"]'); // 属性セレクタ
$(':hidden'); // jQuery独自セレクタ
ベンチマークスコアで表すと以下のようになる。テスト環境は次の通り。
Testing in Chrome 28.0.1500.95 32-bit on Windows Server 2008 R2 / 7 64-bit
※スコアが高いほど高速
$('#hoge'); // 1,342,595
$('div'); // 312,672
$('.hoge'); // 256,658
$('#hoge').find('.hoge'); // 175,491
$('.hoge', '#hoge'); // 158,029
$('#hoge').find('div.hoge'); // 77,628
$('#hoge .hoge'); // 26,625
$('[name="hoge"]'); // 23,506
$(':hidden'); // 1,274
こうしてみるとIDセレクタが圧倒的なパフォーマンスを誇っており、jQuery独自セレクタが圧倒的に遅い。
タグとクラスセレクタもなかなかに高速であると判明したが、結果からすると極力IDセレクタを用いた方が幸せになれそうである。
jQuery独自セレクタに関しては、わざわざ用いる場面に遭遇したことが無いのであまりピンと来ないが、実装を強いられない限り他のアプローチでどうにか解決するべきなのは間違いない。だって遅すぎるし（笑）。
更なる詳細は以下URLを参照。色々なパターンのベンチマークを見ることが出来る。
http://jsperf.com/id-vs-class-vs-tag-selectors
argumentsクラスのcalleeプロパティを用いる。
function foo(){
// 処理
arguments.callee(); // 自分自身を呼び出す
}
よく例として挙げられるのは階乗や総和の計算。
ほかにもエレガントに使えそうな場面があったら使ってみようかな。
■var有り
宣言された関数内にてローカルスコープを持つ変数として振舞う。
また、DontDelete属性を持つためdelete演算子による削除が出来ない。
■var無し
関数内部での宣言であってもグローバルオブジェクトのメンバ変数として振舞う。
これは挙動をちゃんと理解してないとどっぷりはまるレベルの違い。
何か特別必要じゃない限りvar宣言は常にしておくでFAかな。
基本的な事だと思うけど、画面がレンダリングされた後に追加された要素に対してはイベントが割り振られないという罠におもっくそはまった。
とおもったら、意外と簡単に解決したので一応メモ。
ざっくり言うと、append()処理が走る関数内でイベントを宣言してあげればよい。
$(function(){
var html = '<button class="appended">btn</button>';
$('div.target').append(html);
$('.appended').click(function(){
alert('ok'); // 割り当てたい処理や関数を記述
})
})
シンプルだね！
メモ。
var elem = $('div');
// すぐ次の要素を選択する。それ以降の要素は走査しない。
elem.next();
// 次以降全ての要素を取得する。
elem.nextAll();
// すぐ後ろの要素を選択する。それ以前の要素は走査しない。
elem.prev();
// 後ろの要素を全て取得する。
elem.prevAll();
上記関数はいずれも引数に条件を渡すことで厳密に要素を定義することが可能。
必要だったので調べたらよさげなライブラリをみつけた。
ココ↓
http://labs.cybozu.co.jp/blog/mitsunari/2007/07/md5js_1.html
■使い方。
1, まずは上記のURLから「md5.js」をダウンロード
2, 落としたJSを読み込む
<script type="text/javascript" src="md5.js"></script>
3, 下記のようにして使う。
var str = 'abcde'; // md5化したい文字列 var md5 = CybozuLabs.MD5.calc(str); console.log(md5);
文字列にマルチバイトが含まれている場合は、第2引数に「CybozuLabs.MD5.BY_UTF16」を渡してやること。
以下例。
var str = 'あかさたな'; // md5化したい文字列 var md5 = CybozuLabs.MD5.calc(str, CybozuLabs.MD5.BY_UTF16); console.log(md5);
いわゆるUnixTime。
var time = parseInt(new Date()/1000); console.log(time);