在jQuery中，:last 选择器是一个非常实用的功能，它允许我们轻松地选取某个选择器匹配的元素集合中的最后一个元素。虽然这个选择器看起来很简单，但是通过巧妙地结合其他jQuery方法和选择器，我们可以实现非常复杂的DOM操作。下面，我们就来揭秘jQuery中巧妙使用 last 选择器的实用技巧与案例。

技巧一：结合 .eq() 方法实现精确定位

当我们需要选取特定集合中的最后一个元素时，单纯使用 :last 可能不够精确。这时，我们可以结合 .eq() 方法来实现。.eq() 方法允许我们通过索引来选取元素。

$(document).ready(function() {
    $('#list li:last').eq(0).css('color', 'red');
});

在这个例子中，我们首先选取了ID为 list 的元素下的所有 li 元素中的最后一个，然后通过 .eq(0) 方法确保选取的是索引为0的元素（即最后一个元素）。最后，我们将这个元素的文本颜色设置为红色。

技巧二：结合 .find() 方法查找子元素

有时，我们可能需要选取某个元素内部的最后一个子元素。这时，我们可以结合 :last 和 .find() 方法来实现。

$(document).ready(function() {
    $('#container .item:last').find('p:last').css('font-weight', 'bold');
});

在这个例子中，我们首先选取了ID为 container 的元素下的所有 .item 元素中的最后一个，然后通过 .find('p:last') 方法找到了这个 .item 元素内部的最后一个 p 元素。最后，我们将这个 p 元素的字体加粗。

技巧三：结合 .prev() 和 .next() 方法追踪相邻元素

有时候，我们需要追踪某个元素的最后一个相邻元素。这时，我们可以结合 :last、.prev() 和 .next() 方法来实现。

$(document).ready(function() {
    $('#list li:last').prev().next().css('text-decoration', 'underline');
});

在这个例子中，我们首先选取了ID为 list 的元素下的所有 li 元素中的最后一个，然后通过 .prev() 方法找到了它的前一个元素，最后通过 .next() 方法找到了它的后一个元素。我们将这个后一个元素的文本装饰设置为下划线。

技巧四：结合 .filter() 方法筛选特定元素

有时，我们需要在某个元素集合中筛选出最后一个符合条件的元素。这时，我们可以结合 :last 和 .filter() 方法来实现。

$(document).ready(function() {
    $('#list li:last').filter(':contains("text")').css('background-color', 'yellow');
});

在这个例子中，我们首先选取了ID为 list 的元素下的所有 li 元素中的最后一个，然后通过 .filter(':contains("text")') 方法筛选出包含特定文本的元素。最后，我们将这个元素的背景颜色设置为黄色。

总结

:last 选择器是jQuery中一个非常实用的功能，通过结合其他方法和选择器，我们可以实现更加复杂的DOM操作。本文介绍了四个实用技巧，希望对您有所帮助。在实际开发中，我们可以根据具体需求灵活运用这些技巧，提高开发效率。