IT the Best

はてなブログのカスタマイズ情報を中心に、WEBデザインからJavaScriptまでWEB系の開発情報を発信します。便利ツールや暇つぶしのゲームなど開発物も公開します。

【jQuery】要素検索エラーにより知らないid「sizzle...」が生成される不思議な現象の謎

f:id:Surprisedblog:20191020201808p:plain


先日、HTML要素に「"」と「'」(ダブルクォーテーション、シングルクオーテーション)を含むクラス名を設定して、jQueryの要素検索でそのクラス名を指定して取得しようとしたときのことです。

 

実行すると、

Syntax error, unrecognized expression

とconsoleに表示されました。

ふとその要素を見てみると知りもしないIDが設定されていました!そのIDは、「sizzle」と10ケタ以上の数字を合わせたものでした。(id="sizzle123456.....")

 

理解できずにソースコードを見返して自分で設定しているのかを確認しましたが、もちろんそのような処理は書かれておらず、気になって「jQuery sizzle」とGoogleで調べてみました。

検索結果のタイトルには「jQuery」と「sizzle」のキーワードが存在するものがあり、jqueryに関連するものだとわかりひとまず安心しました。
そして、検索結果内のひとつのページをのぞいてみると、「sizzle」についてこのようなことが書かれていました。

SizzleとはjQueryで要素検索を行うためのモジュールである

どうやら、sizzleはjQueryのモジュールの名前らしいです。

 

ですが、どうして要素検索をしてエラーとなった要素にIDが設定されたのかは謎です。公式ドキュメントを調べれば情報が載っていると思いますが...

 

以上、jQueryの面白い発見でした。