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

thisとjsのeventの違いを詳しく解説

小云云
小云云オリジナル
2018-01-03 16:33:531997ブラウズ

この記事では主にthisとjsのeventの違い(詳細説明)を踏まえた記事をお届けします。編集者はこれが非常に良いものだと思ったので、皆さんの参考として今から共有します。編集者をフォローして見てみましょう。皆さんのお役に立てれば幸いです。

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

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

<img src=&#39;usa.gif&#39; onclick="changeImg(event)" />
<script>
  var myImages = [
    'usa.gif','canada.gif','jamaica.gif','mexico.gif'
  ];
  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);

関連する推奨事項:

vue でのイベント バスの非親子コンポーネント通信の詳細な説明

JavaScript での addEventListener の使用の詳細な説明

イベントを詳しくご紹介

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

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