如何使用单个 jQuery 选择器过滤 <div> 或 <input> 的 DOM 元素？答案

【问题标题】：How to filter DOM elements that are either <div>s or <input>s using a single jQuery selector?如何使用单个 jQuery 选择器过滤 <div> 或 <input> 的 DOM 元素？
【发布时间】：2011-02-25 14:38:19
【问题描述】：

如何使用单个 jQuery 选择器过滤 <div>s 或 <input>s 的 DOM 元素？例如，如果我有以下 HTML 文档：

<!DOCTYPE html ...>
<html xmlns="...">
<head>...</head>
<body>
    <input value=""/>
    <div></div>
    <select><option value="hi">ho</option></select>
</body>
</html>

我想使用$('body > ???') 之类的东西来选择<input> 和<div>，而不是<select>。

【问题讨论】：

您只想选择<body>标签的直接后代<input>和<div>标签，还是整个文档中的任何<input>和<div>标签？跨度>
只有 body 的直系后代。

标签： jquery dom jquery-selectors

【解决方案1】：

很简单，就像$('input, div')。

【讨论】：

列出所有要选择的元素似乎很愚蠢。最好选择全部并告诉它不选择哪个？喜欢我的回答
不，就是这样。将其视为 CSS 选择器。此外，它的性能更高，阅读更清晰。

【解决方案2】：

用途：

$("body > input, body > div")

【讨论】：

为什么使用body > input 而不仅仅是input？
"@God is good" OP 需要过滤 body 的直接后代，而不是所有的事件 - 检查问题 cmets。我希望你能重新考虑你的否决票。

【解决方案3】：

$("body *").not("select").each(function() {
  // code here
});

类似的东西应该是一种享受。

看这个例子 - http://jsfiddle.net/UeHTV/

【讨论】：

Thomas：在我正在处理的真实 HTML 文档中，有很多元素不是输入、div 或选择。我举的例子……只是一个例子。
嗨@Eduardo Leóny，问题是，还有更多您不会选择的吗？或者更多你会？前者，使用我的，后者，使用@Raveren
我认为从维护的角度来看，白名单是有意义的——如果他决定向页面添加 1500 行新 HTML，他不需要检查所有新代码以消除新标签。选择您想要的标签，您无需额外维护。
在那种情况下，我认为@Raveren 将是@Surreal Dreams 的最佳选择