ホームページ  >  記事  >  ウェブフロントエンド  >  jQuery: click() メソッドでこれを使用して問題を解決する

jQuery: click() メソッドでこれを使用して問題を解決する

黄舟
黄舟オリジナル
2017-06-27 10:00:054849ブラウズ

jQ バージョン: jquery-1.7.2.js

    <div id="box">test</div>
<script>
    $(function(){ 
        $(&#39;#box&#39;).click(function(){ 
            //alert(this.html()); // 报错
            alert(this.innerHTML);// test
            alert($(this).html()); // test
        });    
    });</script>

すみません、$('#box') を介して取得した後、jQueryオブジェクトを取得しました。なぜこれが DOM オブジェクトに対応するのでしょうか、$(this) は jQuery オブジェクトですか?ありがとう!

jquery のない js は存在し、js のない jquery は存在しないことを知っておく必要があります。これは js のものです。function 実行環境では、どうすれば jquery オブジェクトを参照できるでしょうか。 $(this) ベストを着ているのは jquery オブジェクトです。

thisreferencesは、関数実行の環境オブジェクトです。たとえば、グローバルに呼び出される場合、これはウィンドウです。したがって、this は $("#box") によって返されません。これは JQ オブジェクトではなく、この関数を呼び出す div の dom オブジェクトです。この点をよくご理解ください。携帯電話での入力が非常に難しい場合は、明日コンピューターの電源を入れてみると、

$('#box') が JQuery オブジェクトを返したことが表示されるので、click( を呼び出すことができます。 ) メソッドは後で説明します。このステップは

var $box = $(&#39;#box&#39;);
$box.click(function(){    //TODO});

と同等であることに注意してください。関数実行の環境オブジェクトは、コードによって取得されるオブジェクトとは何の関係もありません。 イベント をこの DOM にバインドすることです。イベントがトリガーされます。これは単なる DOM です

$(this) はこれを変更しません DOM オブジェクトは、シェルのレイヤーを追加して JQuery オブジェクトに変換するのと同じように、一度ラップされるだけで、JQuery メソッドが使用できるようになります。セレクターを渡すような DOM の検索は行わないため、このイベント div.box の現在のトリガーのままです。ラップされた JQuery は DOM オブジェクトに復元できます。

イベント オブジェクトを通じてイベントをトリガーしたオブジェクトを取得するには、次のコードを見てください:

$(&#39;.box&#39;).click(function(event){    console.log(event.target);    console.log(event.target==this);//非事件冒泡情况下为true
    console.log($(this).get(0)==this);//true});

以上がjQuery: click() メソッドでこれを使用して問題を解決するの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

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