为什么这个 jquery 不起作用？答案

【问题标题】：why doesnt this jquery work?为什么这个 jquery 不起作用？
【发布时间】：2013-09-01 13:20:48
【问题描述】：

在我的程序中，我有一个 jquery 行

$( '#monsters[0]').animate( { left: "+=25" },500);

我有一个名为 monsters 的数组，但我不明白为什么会有所不同，当我将 id 更改为不同的图像 id 时，此代码确实有效，而我将 ('img') 改为它甚至适用于图像ID monsters[0] 我也确定这是图像 ID。但是我运行上面的代码，图像没有任何反应，控制台也没有出现错误，谁能解释一下？

link here，如果这有帮助的话。

【问题讨论】：

Obtain values of array with jquery的可能重复

标签： javascript jquery

【解决方案1】：

字符[ 和] 在选择器中具有特殊含义（它们表示an attribute selector）。如果您想将它们用作 ID 选择器（或任何其他类型的选择器）的一部分，您必须使用 \ 转义它们。

请注意，由于您将选择器表示为字符串文字，因此您也必须转义转义序列。

'#monsters\\[0\\]'

【讨论】：

非常有用，但事实上我需要document.getElementById('monsters[0]')（dystroy 的回答）因为我动态地这样做只是一个例子，但真的谢谢你
@tryingToGetProgrammingStraight — 没有什么能阻止您将 \ 字符动态添加到字符串中，因此您无需避免使用选择器语法。
你在尝试document.getElementById('monsters[0]') 之后，我意识到我必须动态添加转义符
你能让我的生活更轻松，并告诉我如何最好地添加这些转义符或给我一个解释链接吗？
@tryingToGetProgrammingStraight — 原始答案中有一个示例。一旦它们成为字符串的一部分，您就可以像对待任何其他字符一样对待它们。

【解决方案2】：

'#monsters[0]' 不能被 jQuery 解析为这意味着元素有一个 id "monsters[0]"。它被解析为对具有 id monsters 和属性 0 的元素的查询。

你可以这样做

$(document.getElementById('monsters[0]')).animate( { left: "+=25" },500);

如果您多次使用它，您可以自己构建一个小实用程序：

function $$(id) { return $(document.getElementById(id)) }

这样你只需要做

$$('monsters[0]').animate( { left: "+=25" },500);

但你可能应该避免使用这些 id，例如它们会给你带来 CSS 中的相同问题。在这里，类或数据属性看起来更有意义。

评论：

当然还有另一种动态转义[ 和] 字符的解决方案（以及稍后可能出现的其他字符）。不要这样做：这使代码更加复杂，隐藏了它仅适用于某些形式的 id 的事实，并且更重：您构建一个 jQuery 将解析以了解您需要 id 的字符串，然后 jQuery 将致电document.getElementById。直接使用document.getElementById，更清晰、更可靠、更高效。

【讨论】：

@tryingToGetProgrammingStraight 我详细说明了我的解释。现在清楚了吗？
@trying 因为 jQuery 使用尖括号，就像它们在 CSS 中定义的一样。作为条件，例如a[href ^= 'https://']（href 以https:// 开头的所有链接）。首先，您真的不应该拥有 ID 为 monsters[0] 的元素。以monsters_0 为例。
@Tomalak — 您似乎混淆了方括号 [] 和角度 <> 括号。 “条件”在这里不是一个很好的术语，选择器中的所有内容都是条件，它们是属性选择器。为什么他一开始就不应该有这样的 id？
我不会混淆方括号和尖括号。我本可以说“谓词”，但这只是“条件”的另一个词。为什么你不应该有这样的身份证？因为它会干扰您使用的系统。例如，它使编写 CSS 和 jQuery 变得更加困难。它通过不必要的转义使代码混乱，并且由于在不适当的地方使用了编程符号而使其更难理解。出于实用性和敏感性的原因，ID 应该是一个字符串，它不应该看起来像一点代码。
@dystroy 第三个变种是$("*[id='monsters[0]']")，它也可以在不转义的情况下工作。无论如何，OP 已经证实了我对 ID 包含尖括号的怀疑，因为他在某个时候对它们进行了评估。这证实了我的观点 - 这是不好的和错误的，OP 一开始就不应该使用这样的东西。

【解决方案3】：

$( '#monsters').animate( { left: "+=25" },500);

会的。

$( '#monsters') 提供了一个 jQuery 包装的对象。

【讨论】：