5

假设我有以下要求：如果存在这样的元素，则将元素添加e到具有 id"x"的元素，否则添加e到正文。

在 DOM 级别 0 中，我可以编写：

var parent = document.getElementById("x") || document.body;
parent.appendChild(e);

在 jQuery 中，以下内容不起作用：

var parent = $("#x") || $("body");
parent.append(e);

因为如果不x存在具有 id 的元素，则第一个析取项返回空的 jquery 对象，其中是真实的，而不是虚假的，所以append什么都不做。但是，我可以写：

var parent = $("#x")[0] || $("body")[0];
parent.appendChild(e);

但是这个解决方案有点笨拙，因为索引 jQuery 对象让我回到 HTMLElements，所以我必须使用appendChild而不是append. 虽然这可行，但我想知道这种级别的混合是否合适或表明设计不佳。

有没有办法使用first()？也许我可以创建一个 jQuery 对象，它本质上是一个数组，其第一个元素是 id 为 x 的 div，第二个元素是 body。我知道我可以使用带有元素数组的 jQuery 构造函数表单来做到这一点，但是我又回到了混合级别。我也知道如何检查 id x ( $("#x").length) 的元素是否存在，但我看不出这将如何导致一种优雅的方式来表达“如果存在 id x 的元素，否则为主体”。

这样的公式存在吗？

4

2 回答 2

3

老实说，我真的不认为这是非常冗长的：

var parent = $('#x');
if(parent.length == 0) parent = $('body');

而且其意图也相当明确。如果这个习语经常出现，你甚至可以将它包装在一个函数中。

此外，这是一个三元形式，每个查询只触发一次（尽管它是在可读性上的权衡）：

var parent = (x = $('#header')).length ? x : $('body');
于 2012-07-22T03:29:04.623 回答
2

您可以使用它来包装原生 DOM 调用，而不是使用 jQuery 来选择元素：

$(document.getElementById("foo") || document.body)

它不是很优雅（甚至不是真正使用 jQuery），也不是一种普遍适用的技术，但您最终会得到一些可以附加的东西（并且只需要一次相对便宜的 jQuery 调用）。

您将无法使用first()——例如$("#foo, body").first();——因为它返回选定元素的顺序是基于 DOM 顺序，而不是选择器顺序（感谢 @muistooshort）

于 2012-07-22T03:32:58.023 回答