3

私はいくつかのjQueryをクリーンアップしようとしていますが、jQuery呼び出しを特定のdom要素にスコープするための呼び出しが何であるかを完全に把握できません。例を挙げると、次のコードがあります。

$('#outer-element .first-class').html('wanna');
$('#outer-element .second-class').html('scope');
$('#outer-element .third-class').html('better');

これらの第 1/第 2/第 3 クラスの呼び出しのそれぞれを 1 つの共通の外部要素呼び出しに呼び出す方がよりエレガントなアプローチだと思いますが、それを行うための構文が何であるかはわかりません。私は次の線に沿って何かを推測しています

$('#outer-element').SOMETHINGGOESHERE(function() {
  $(this).find('.first-class').html('wanna');
  $(this).find('.second-class').html('scope');
  $(this).find('.third-class').html('better');
});

何か案は？私が上で提案したものよりもエレガントなものはありますか? 要するに - 私は上記が醜いことを知っています。このような JavaScript へのよりきれいなアプローチを探しています。

4

3 に答える 3

5

コードの量が管理できる限り、私は通常、散在する.end()呼び出しですべてを連鎖させます。

$('#outer-element')
    .find('.first-class').html('wanna').end()
    .find('.second-class').html('scope').end()
    .find('.third-class').html('better').end();

この方法で行う場合は.end()、トラバース操作ごとに 1 つだけ含めるように細心の注意を払う必要があります。このため、Python を思い起こさせる方法で空白を使用して、義務の範囲を超えることをお勧めします。

$('#outer-element')
    .find('.first-class')
        .html('wanna')
    .end()
    .find('.second-class')
        .html('scope')
    .end()
    .find('.third-class')
        .html('better')
    .end();

最後.end()は必要ありませんが、コードが変更された場合、将来的に必要になる可能性があります。転ばぬ先の杖。

于 2012-10-16T19:15:29.950 に答える
4

オブジェクトを変数に格納し、キャッシュされたオブジェクト内で見つけます

var $this = $('#outer-element');

  $this.find('.first-class').html('wanna');
  $this.find('.second-class').html('scope');
  $this.find('.third-class').html('better');
于 2012-10-16T19:15:59.590 に答える
2

オブジェクトをキャッシュできます:

var $outer = $('#outer-element');
$outer.find('.first-class').html('wanna');
$outer.find('.second-class').html('scope');
$outer.find('.third-class').html('better');
于 2012-10-16T19:15:55.450 に答える