Chrome のデベロッパー ツール コンソールの $ 変数の目的は何ですか?

Chrome の $ 変数

質問:

Chrome の開発者ツールを調べているときjQuery のないページでは、特有の動作が観察されました。コンソールに「$」を入力すると、ネイティブ コードの関数が返されました。この関数には window['$']、document['$']、または this['$'] からアクセスできませんでした。その目的は依然として謎のままです。

答え:

Chrome の devtools コンソールの $ 変数にはいくつかの変更が加えられました。現在、document.querySelector のエイリアスとして機能し、追加の機能を提供します。

• $(selector): 次のように、CSS セレクターに一致する最初の DOM 要素への参照を返します。 document.querySelector().
• $$(selector): CSS セレクターに一致する要素の配列を返し、実質的に document.querySelectorAll().
• $_: 最後に評価された式の値を保存します。
• $0、$1、$2、$3、$4: 検査された最後の 5 つの DOM 要素への履歴参照を提供します。

注目すべき点として、$$ は NodeList の代わりに配列を返すため、文字通り document.querySelectorAll() を呼び出すわけではありません。

Chrome は、この $ 変数を公開する唯一のブラウザです。これは、DOM 要素を操作したり、開発者ツール コンソール内のさまざまな式やオブジェクトにアクセスしたりするための便利なショートカットとして機能します。

以上がChrome のデベロッパー ツール コンソールの $ 変数の目的は何ですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。