将两个 child() 调用压缩为一个答案

【问题标题】：Compressing two children() calls into one将两个 child() 调用压缩为一个
【发布时间】：2011-08-26 04:20:37
【问题描述】：

如何转这个，它使用两个调用两个children：

$('#id tr').children('td').children('input')

变成只叫孩子一次的东西？我正在尝试选择特定表格行 (tr) 中的每个输入文本框，它是#id 的子项。我试过了

$('#id tr').children('td input')

和

$('#id tr').children('td > input')

但这些都不起作用。我对这些选择器表达式有点陌生，如果很明显很抱歉。

【问题讨论】：

【解决方案1】：

虽然我喜欢$("#id tr td input") 的建议，但在某些情况下（例如，如果您有来自其他来源的$("#id tr") 对象）您可能会寻找.find()，它可以深入多个级别（而不是@987654325 @只有一个）：

$("#id tr").find("td input")

【讨论】：

检查我的答案，基本上可以让你使用其他来源的选择器。
@kuroir，是的，如果你有选择器而不是对象，你也可以使用$("x", "y") 语法。虽然——这并不重要——我见过的一些测试显示$("x", "y") 比$("y").find("x") 慢。我觉得它更糟糕，因为它不那么明确。
就像一个魅力。好的是find 深入了多个层次，直到阅读这个答案我才知道，因此我可以将其减少到$('#id').find('input'); 再次感谢，+1 并检查。跨度>

【解决方案2】：

为什么不只是$('#id tr input')？

或者$('#id input')

【讨论】：

【解决方案3】：

我很惊讶没有人推荐这个：

$('td input', '#idc tr')

这将允许您从变量中获得#idc tr 部分。基本上你正在做的是连接；所以你先读右边的选择器，然后再读左边的，例如：

$('> input', 'div')

相当于：

$('div > input')

现在，让我们在这里打高尔夫球吧；您传递选择器的方式可以简化为以下两种形式：

$('input', '#idc td')
// vs
$('#id').find('td input')

两者基本相同，但是您可能已经注意到，第二个允许您执行 jquery 链接；使用.end() 回到上一个选择器#id。

每当我需要做一些简单的事情而不需要我回到上一个选择器时，我通常会使用第一条语句。

【讨论】：

【解决方案4】：

你可以为你的输入设置一个类并选择它

$('#id tr').children('td:input').hasclass('class name')

【讨论】：

这不仅不起作用，因为td:input 是无效的语法，它也不起作用，因为hasClass（不是hasclass）返回布尔值而不是jQuery 对象。跨度>