その32014/02/13この記事は書かれてから1年以上が経過しており、最新の情報とは異なる可能性がありますTechDOMJavaScriptjQuerypolyfills意図せずシリーズ化してしまった、前回からの続き3回目です。ソースコードリーディングしています。読み込まれている前提となります。みたいなアレとほぼ同じです。)を指定して、それに当てはまる要素全てを取得できます。要素を一通り取得出来ていることが分かると思います。以前のブラウザでは一切動作しなくてもいい、というケースにおいては普通に使うことが出来ますね。同等のものが実現出来ることも容易に想像がつきます。181〜199行目を抜粋します。以前でも普通に使えるレベルまでもっていけないか?という試行錯誤の跡になっています。難しいので特徴だけ軽くまとめてみようかと・・・。用いるとめちゃめちゃ遅くなるが、要素取得のみに限定して使うことで全体として速くなっている(らしい)(まあハックなのでこれくらいの理解でいいかなと・・・)詳しくは以下に掲載されているようです。取得したものの頭のものを持ってくるだけなので省略します。要素をクラス名で取得します。今まで無かったのが不思議ですね。開発者ツールを開いて、以下のように取得ができます。211行目のみ抜粋します。流用して提供されています。渡してやっているだけですね。置き換えるようになっています。このように丁寧に順を追って見ていくと、かなり時間がかかりますね。なんなのか、というところから書いてみます。?とある要素に対して、「この要素の位置やサイズくださいー」と呼び出すと、以下のようなプロパティが含まれているオブジェクトが返ってきます。オブジェクトが返ってきます。上記をそのまま試したキャプチャです。その要素が上から何ピクセル、左から何ピクセル、あるいは幅が何ピクセルか、などが一通り分かります。offset(≒上、左からどんだけずれているか)などの処理で使われているようです。補完するためのコードが216〜221行目に相当します。触れておこうと思います。以降からしか使えません。プロパティを上書き(なければそのまま定義)することができます。ご覧いただいた方が良いと思います。同等のことが実現出来ます。その公式ページからの抜粋です。100}のようになります。存在しているところは上書きされていますね。こちらも、詳しくは以下の公式ページに掲載されています。226行目のみ抜粋してみます。その中身では、すぐに例外を投げています。介して要素を生成するようになっているためです。出来ないようになっています。いうことくらいは知っておいてもいいのかもしれません。