月: 2017年9月

[JavaScript] jQuery無しでも$(ドル記号)で要素選択したい

昨今のモダンブラウザに於けるJava Scriptの標準仕様(ECMAScript)への準拠の流れを受けて、わたしもChrome拡張(エクステンション)など実行環境を制限出来るウェブアプリの開発に於いてはjQueryに頼らないコーディングを心がけるようになりました。

ただ、いくらネイティブJavaScriptが高度化したとはいえ現状ではまだまだ発展途上な感が否めず要素を選択するだけでもソースが冗長になりがち。

// jQuery
$(".class");

// 非jQueryだと長ったらしい
document.querySelector(".class");

jQueryの開発チームもECMAScript標準化には関与しているそうなので、将来的に「$()」が「document.querySelector()」のエイリアスになるんじゃね?なんて思っていたら、既にChromeブラウザのdevToolsはそのような実装をしている模様。ちなみに、「$$()」は「document.querySelectorAll()」と同様の結果を返してきます。