3

我只是想清理一些 jQuery，并不能完全弄清楚将 jQuery 调用范围限定为特定 dom 元素的调用是什么。举个例子，我有以下代码：

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

我猜将这些第一/第二/第三类调用中的每一个调用到一个常见的外部元素调用是一种更优雅的方法，我只是不确定这样做的语法是什么。我猜是这样的

$('#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()为每个遍历操作包含一个；出于这个原因，以一种让人想起 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 回答