Javascript 为什么jQuery似乎不向嵌套的跨距添加文本？

我试过几种不同的方法，但都不起作用。我是这样开始的：

var messageHtml = "<span class='message-bundle' id='" + randomId + "'></span>";
$(".visualizer").append(messageHtml);

我最初将它们保留为空，因为我想针对XSS漏洞对它们的内容进行清理到目前为止，一切正常。然后我将经过消毒的文本添加到这些嵌套跨距中

$(".message-bundle .usertag#" + randomId).text(msgObj.usertag);
$(".message-bundle .message#" + randomId).text(msgObj.message);

---

这是行不通的。我已尝试打印出这两个元素的

.text（）

，但它们包含空字符串。为什么会这样？在创建上面的

.usertag

和

.message

跨度时，我是否可以对字符串进行清理并将其内联添加（而不是使用

.text（）

）？

ID在文档中必须是唯一的-您将同一ID分配给多个元素。（或者这只是简单的代码？

id

s需要在整个文档中是唯一的，并且您正在复制它们。无论如何，这是不恰当的使用它们；您应该多使用元素，少使用HTML

var message =
    $('<span>', { class: 'message-bundle' })
        .append($('<span>', { class: 'usertag', text: msgObj.usertag }))
        .append($('<span>', { class: 'message', text: msgObj.message }));

$('.visualizer').append(message);

var消息=
$（''，{class:'消息包'}）
.append（$（''，{class:'usertag'，text:msgObj.usertag}））
.append（$（''，{class:'message'，text:msgObj.message}））；
$（'.visualizer'）.append（消息）；

---

这会附加一些元素，您可以在创建这些元素时将其作为适当的对象进行操作，而不是在添加HTML后重新选择它们。

问题在于您在

之后放置的
。

@Barmar:不，不是-请查看整个表达式：

”。messagebundle“+randomId

我误读了代码，我认为

randomId

是类的一部分。每个

randomId

都位于

$（“.message bundle.usertag.#”+randomId.text（msgObj.usertag）$（“.message bundle.message#”+randomId.text（msgObj.message）

相同的

id

？因为它是一个表达式，所以它们必须是相同的。他为每个表达式分配了不同的

随机id

。@Barmar:

随机id

在

消息包

、

用户标签

和

消息

之间重复。

var message =
    $('<span>', { class: 'message-bundle' })
        .append($('<span>', { class: 'usertag', text: msgObj.usertag }))
        .append($('<span>', { class: 'message', text: msgObj.message }));

$('.visualizer').append(message);