38

次の違いは何ですか:

$(this.el).html

と

this.$el.html

いくつかのバックボーンの例を読んで、いくつかはある方法でそれを行い、他の方法でそれを行います。

4

6 に答える 6

55

$(this.el)jQuery (または Zepto) で要素をラップします。したがって、ビュー HTML が次の場合:

<div id="myViewElement"></div>

...そしてthis.elその div を参照する$(this.el)と、jQuery: 経由で直接取得するのと同じになります$('#myViewElement')。

this.$elは jQuery (または Zepto) オブジェクトへのキャッシュされた参照であるため、 を呼び出して得られるもののコピーです$(this.el)。その目的は、 を呼び出す必要をなくすことです$(this.el)。これにはオーバーヘッドがあり、そのためパフォーマンスの問題が発生する可能性があります。

注意:この 2 つは同等ではありません。this.el単独で、ホスト オブジェクト HTMLElement への参照です。ライブラリは関係ありません。のリターンですdocument.getElementById。$(this.el)jQuery/Zepto オブジェクトの新しいインスタンスを作成します。this.$el前のオブジェクトの単一のインスタンスを参照します。への複数回の呼び出しのコストを理解している限り、それらを使用することは「間違っている」わけではありません$(this.el)。

コード内:

this.ele = document.getElementById('myViewElement');
this.$ele = $('#myViewElement');

$('#myViewElement') == $(this.ele);

また、jQuery と Zepto には部分的な内部キャッシュがあることにも言及する価値があります。そのため、余分な呼び出しを行うとキャッシュされた結果が返される$(this.el) 可能性があるため、「パフォーマンスに問題がある可能性がある」と述べています。そうでない場合もあります。

ドキュメンテーション

于 2012-07-16T20:41:35.857 に答える
6

2つは本質的に同等であり、jQueryまたはZeptoオブジェクトの$elキャッシュバージョンelであるため、使用例が表示される理由は、backbone.jsの新しいリリース（0.9.0）で$(this.el)のみ追加されたためです。

*技術的には、Chris Bakerが指摘している$(this.el)ように、（おそらく）呼び出すたびに新しいjQuery / Zeptoオブジェクトが作成され、this.$el毎回同じオブジェクトが参照されます。

于 2012-07-16T20:44:59.107 に答える
2

それらはまったく同じものを生成します。つまり、ビューの要素への参照です。$el は、単に $(this.el) の jquery ラッパーです。このリファレンスを見てください: http://documentcloud.github.com/backbone/#View- $el

于 2012-07-16T20:47:49.280 に答える
2

が$el存在しthis、jQuery オブジェクトである場合は、使用しないでください$(this.el)。既に存在する場合に新しい jQuery オブジェクトを初期化することになるためです。

于 2012-07-16T20:38:34.500 に答える
1

私は通常これを見ます：

var markup = $(this).html();
$(this).html('<strong>whoo hoo</strong>');

私はラミノンに同意します。あなたが見たあなたの例は間違っているように見えます。

このコードは通常、each() などの jquery ループまたはイベント ハンドラー内で見られます。ループ内では、「el」変数は jQuery オブジェクトではなく純粋な要素を指します。イベント ハンドラー内の「this」についても同じことが言えます。

$(el) または $(this) が表示される場合、作成者は dom オブジェクトへの jQuery 参照を取得しています。

数字をローマ数字に変換するために使用した例を次に示します: (注: $ の代わりに常に jQuery を使用します -- mootools との衝突が多すぎます...)

jQuery(document).ready(function(){
    jQuery('.rom_num').each(function(idx,el){
        var span = jQuery(el);
        span.html(toRoman(span.text()));
    });
});
于 2012-07-16T20:43:11.603 に答える
0

$() で要素をラップすると、jQuery 拡張機能がオブジェクト プロトタイプに追加されます。これが完了したら、再度実行する必要はありませんが、複数回実行してもパフォーマンス以外に害はありません。

于 2012-07-16T20:41:31.963 に答える