2011-11-13 12 views
0

私はチュートリアルを読んでいて、コードの最初の行に固執し続けています。私はオブジェクトの作成には "新しい"ことを知っていますが、このチュートリアルはそれとは関係ありません。チュートリアルはここにあるこの単純なjavascriptは何ですか?

var img = new Image(); 

を助けてください:newはJavaScriptで、http://www.w3schools.com/jsref/dom_obj_image.asp

+0

変数をのimgために表している、この特定の行は一切のjQueryとは関係ありません。 – BoltClock

+0

@BoltClockチュートリアルはjQueryで書かれています!! '$(new Image())。attr(" src "、" image.png ")' – noob

+0

私はこのチュートリアルではなく、 "この特定の行"と言っています。 – BoltClock

答えて

3

実際:

http://jqueryfordesigners.com/image-loading/

[OK]を、私は事前に定義されたjavascriptオブジェクトイメージ()のW3の定義を見つけましたPHPのように、オブジェクトを作成するときにも使用されます。

したがって、このコード行はImageオブジェクトをインスタンス化し、img変数に割り当てます。

+0

これは私の意見ですが、このチュートリアルでは "Image"オブジェクトを定義していません。 –

+1

@A_funs: 'Image'はHTMLイメージを表す組み込みのDOMクラスです。そうでない場合はデフォルトで利用できますすべてのブラウザ。 – BoltClock

+0

FirebugをインストールしてFirebugをインストールしている場合は、ページが読み込まれた後、console.log(img)やconsole.log(Image)などを入力して検査することができます。これは、imgがImageのインスタンス化されたインスタンスであり、Imageが関数であることを伝えています。そうすれば、Imageは組み込み関数であることがわかります。 – dnuttle

0

あなたは、彼らはそれがロード画像やフェードを隠す持ち運びにくい、その後

をロードされるまで、彼らは待っ画像画像/ headshot.jpg

をプリロード

var img = new Image(); 

で画像をプリロードすることができます画像内で

0

これはjQueryとは関係ありません。

イメージは、HTMLイメージオブジェクトに対応するネイティブJavaScriptオブジェクトです。

ラインが何を意味するのか、それはあなたのためのHTMLフォームを作るのです「新しい変数 『IMG』を作成し、新たに初期化Imageオブジェクトに設定」

+0

ですが、チュートリアルではImageオブジェクトは定義されていません –

+0

イメージオブジェクトが作成されます。当初それに関連付けられたデータはありません。このチュートリアルでは最初にimageオブジェクトに "onload"イベントをアタッチし、/ src/"src"アトリビュートを設定することに注意してください。 これは、オブジェクトを作成し、イメージをロードしてから、onloadイベントを実行するという効果があります。 src/before/onloadをロードした場合、キャッシュされたイメージはonloadイベントを発生させません。チュートリアルの –

+0

が使用されます。 – noob

0

です。詳細は

が、これはあなたに多くを助けるかもしれない。このhttp://www.devguru.com/technologies/ecmascript/quickref/image.html

希望をお読みください。

またはあなたはそれが

var img = new Image(); 

なく使用を作成知りたいですか?

$(img) 
    // once the image has loaded, execute this code 
    .load(function() { 
    // set the image hidden by default  
    $(this).hide(); 

    // with the holding div #loader, apply: 
    $('#loader') 

    // remove the loading class (so no background spinner), 
    .removeClass('loading') 
    // then insert our image 
    .append(this); 

    // fade our image in to create a nice effect 
    $(this).fadeIn(); 
    }) 

    // if there was an error loading the image, react accordingly 
    .error(function() { 
    // notify the user that the image could not be loaded 
    }) 

// *finally*, set the src attribute of the new image to our image 
.attr('src', 'images/headshot.jpg'); 
}); 

「この」キーワードは、ほんの少しのノート

関連する問題