3

バックボーン ビューで内部要素を検索する場合、スコープを に制限することで最適なパフォーマンスが得られthis.$elますfind()か?それともメソッドで DOM 全体を検索する必要がありますか?

これが私が話していることのスタブの例です:

<!-- a bunch of other stuff -->
<div id="outer">
    <!-- a bunch of other stuff -->
    <div id="inner">foo</div>
</div>
<!-- a bunch of other stuff -->
<script>
    var myView = new MyView({el: $('#outer')}); 
</script>

MyView は次のとおりです。

MyView = Backbone.View.extend({
    //other code

    useScoping: function() {
        var $innerElement = this.$el.find('#inner');
        $innerElement.text('bar');
    },

    noScoping: function() {
        var $innerElement = $('#inner');
        $innerElement.text('bar');
    } 
});

useScoping()よりも効率的ですnoScoping()か？this.$elオブジェクトの構築時にキャッシュする必要があるため、スコープを使用するときに検索で'#inner'DOM 全体をカバーする必要はありません。でも確かめたかった。class="inner"JavaScript に適切な変更を加えた場合、同じことが当てはまりますか?

4

3 に答える 3

4

使用するセレクターによって性能が異なります。あなたが提供した例では、 #inner セレクターは ID で要素を検索します。これは、内部で維持されているインデックスを使用し、ドキュメントをスキャンしません。おそらく、クラスを使用した選択にも当てはまります。

ただし、対応するネイティブ実装がない他のセレクターは、スコープによってパフォーマンスが向上します。

// your examples will fall back to these native implementations and
// not be impacted by scoping
document.getElementById('inner')
document.getElementsByClassName('inner')
于 2013-10-17T00:17:25.773 に答える
1

スコープを使用する場合、「#inner」の検索で DOM 全体をカバーする必要はありません。

あなたは正しいです。バックボーン ビューthis.$elは、JQuery でラップされた要素への単なるプロキシであり、DOM 全体ではなく子孫のみを検索するthis.$el.findJQueryも同様です。find

于 2013-10-17T00:18:39.607 に答える