ホームページ  >  記事  >  ウェブフロントエンド  >  JSのイベントとthisの違いを詳しく解説

JSのイベントとthisの違いを詳しく解説

黄舟
黄舟オリジナル
2017-10-24 09:33:052224ブラウズ

今日は、「JavaScript 入門 - イベント」の章で、this とevent の 2 つのパラメーター受け渡しフォームを見ました。ジュニアのフロントエンド開発者として、私は通常これをパラメーターを渡すためにのみ使用するため、これとイベントの違いは何なのか、どのような状況でどちらを使用するのがより適切なのかを本当に知りたいと思っています。

onclick =changeImg(this) vs onclick =changeImg(event)


<img src=&#39;usa.gif&#39; onclick="changeImg(event)" />
<script>
  var myImages = [
    &#39;usa.gif&#39;,&#39;canada.gif&#39;,&#39;jamaica.gif&#39;,&#39;mexico.gif&#39;
  ];
  function changeImg(e) {
    var el = e.target;
    var newImgNumber = Math.round(Math.round()*3);
    while(el.src.indexOf(myImages[newImgNumber]) != -1){
      el.src =myImages[newImgNumber];
    }
  }
</script>

1.thisはJavaScript言語のキーワードです。

2.this は、関数の実行時に自動的に生成される内部オブジェクトを表し、関数内でのみ使用できます。

3. これとevent.targetの違い:

jsのイベントはバブルアップするため、これは変更される可能性がありますが、event.targetは変更されません(イベントがトリガーされると、現在のイベントオブジェクトの参照のみが変更されます)。 ) を渡すと、常にイベントを直接受け取るターゲット DOM 要素になります。

さらに、jquey でメソッドを使用したい場合は、それらを jquery オブジェクトに変換できます。 this) と $(event .target);

以上がJSのイベントとthisの違いを詳しく解説の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。