Jquery追加不起作用答案

【问题标题】：Jquery append not workingJquery追加不起作用
【发布时间】：2014-04-15 08:01:47
【问题描述】：

我正在尝试附加到一个 html 元素，但由于某种原因，当元素的 ID 名称中有 [0] 时，它似乎不允许我这样做。

HTML

<div id="stuff[0]">
    <div id="tag">blah</div>
</div>
<div id="stuff[1]">
    <div id="tag">blah</div>
</div>

JQUERY

var id = "#" + "stuff[0]";
$(id).append("<p>HI</p>");

当我运行代码时它没有附加？解决方法是什么？

代码也可以在fiddle中找到

【问题讨论】：

高度相关：jQuery selector for inputs with square brackets in the name attribute.

标签： jquery html append

【解决方案1】：

当您在 ID 中使用方括号时，您应该在 jQuery 中使用 \ 转义它们您可以在此处阅读有关在选择器中使用特殊字符的更多信息（第二段）：http://api.jquery.com/category/selectors/

我在这里更新了您在 JSFiddle 上的代码：http://jsfiddle.net/Yye2L/7/

var id = "#" + "stuff\\[0\\]";
$(id).append("<p>HI</p>");

【讨论】：

【解决方案2】：

你可以用两个反斜杠转义方括号

var id = "#" + "stuff\\[0\\]";
$(id).append("<p>HI</p>");

【讨论】：

【解决方案3】：

方括号表示 jQuery 中的属性选择器。因此，您不应该使用方括号作为 id 的一部分。

如果必须，您可以使用不带括号的相同代码：

<div id="stuff0">
    <div id="tag">blah</div>
</div>
<div id="stuff1">
    <div id="tag">blah</div>
</div>


var id = "#" + "stuff0";
$(id).append("<p>HI</p>");

如果您不想更改 HTML，可以使用：

var id = "#" + "stuff\\[0\\]";
$(id).append("<p>HI</p>");

这不是很优雅，但可以完成工作......

【讨论】：