Question

我在几个不同的订单中试过这个，但都没有用。我这样开始：

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

randomId是一个随机数。然后我为元素设置top和left定位（设置为position: absolute）。

然后我.append()以下空span个span：

$(".message-bundle#" + randomId).append("<span class='usertag' id='" + randomId + "'></span><br/>" + 
                                        "<span class='message' id='" + randomId + "'></span>");

我最初将它们保留为空，因为我想要针对XSS漏洞清理其内容。 到目前为止，一切都很好。然后我将清理后的文本添加到这些嵌套的跨度中。

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

这永远不会奏效。我尝试打印出这两个元素的.text()，但它们包含空字符串。为什么是这样？在上面创建.usertag和.message跨度（而不是使用.text()）时，我可以以某种方式清理字符串并将其添加到内联中吗？

Answer 1

id需要在整个文档中保持唯一，并且您正在复制它们。不过，这对他们来说是不恰当的用途;你应该使用更多的元素和更少的HTML。

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

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

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

Answer 2

ID在文档中必须是唯一的 - 您要为多个元素分配相同的ID。（或者那只是过于简化的代码？）

为什么jQuery似乎没有向嵌套跨度添加文本？

2 个答案:

为什么jQuery似乎没有向嵌套跨度添加文本？​​

2 个答案:

为什么jQuery似乎没有向嵌套跨度添加文本？