jquery - jQuery構文を使用する場合: $(" ") 、画像は実際にクライアントにダウンロードされますか?

Question

jQuery 構文 :$("<img src='img.jpg'>")を使用すると、イメージは実際にクライアントにダウンロードされますか? または、ダウンロードするために本文に追加する必要がありますか?

Answer 1

画像を読み込むためにドキュメントに画像要素を追加する必要はありません。

画像要素自体は、画像を作成するとすぐに (そして値を持つとすぐにsrc) 画像を要求します。

これを実行すると、(Firebug/Developer Tools で) net activity を監視します: http://jsfiddle.net/Guffa/AvgVN/

これを使用する大量のコード例を見つけるには、Google の「javascript プリロード」を参照してください。

Answer 2

はい、画像はすぐにダウンロードされます。

作成されたImage要素はまだ DOM にありませんが、.src属性が設定されるとすぐにブラウザーは要素のダウンロードを開始します。

独自のアバターを使用して、コンソールでこれを実行しました。

> i = $('<img src="http://graph.facebook.com/100002351317104/picture?type=large">');
...
> i[0].width
180

画像が実際に読み込まれていることを示しています。

考えてみれば、これは実際にそうであるに違いありません。画像のプリロードは、デタッチされたImageノードの作成とその設定に依存します。srcこれはまさに何$("<img src=...>")をするかです。

Answer 3

はい、またはおそらくブラウザに依存します。

$("<img src='http://crssrd.com/web_apps/index/themes/crssrd.com/images/loading.gif'>")​

たとえば、Chrome でこれをテストします。 http://jsfiddle.net/SMnhU/ 画像はすぐにダウンロードされます。