JQuery：动态创建的 html 不响应 JQuery 函数答案

【问题标题】：JQuery: Dynamically-created html not responding to JQuery functionsJQuery：动态创建的 html 不响应 JQuery 函数
【发布时间】：2012-01-17 00:31:05
【问题描述】：

我正在使用此代码动态生成 div：

// my html string :)
var myString = '&lt;id="newDiv"div&gt; hello &lt;/div&gt;';

// html decode the string    
myString = $("<div />").html(myString).text();

// appending the string
$("#parentDiv").append(myString);

它附加得很好（它显示在屏幕上）。并且 $('#newDiv').length 正确显示值为 1。但是当我尝试在它（或任何函数）上调用 remove() 时，就像

$('#newDiv').remove()

什么都没有发生。怎么回事？

【问题讨论】：

标签： javascript jquery html

【解决方案1】：

那里有一些额外的工作。 &lt;id="newDiv"div&gt; hello &lt;/div&gt; 实际上是 <id="newDiv"div> hello </div>，据我了解，这不是正常的 html。

//here is what I think you wanted:
    $('<div id="newDiv">hello</div>').appendTo("#parentDiv");
    alert($("#newDiv").length);
    $("#newDiv").remove();

编辑 - 解码 html 文本，然后附加它：

var emptyDivNeverAppendedToDom = $('<div/>');
//per the other so.com question
    var html = emptyDivNeverAppendedToDom.html('&lt;div id="newDiv"&gt; world &lt;/div&gt;').text();
//just being verbose.
    var elem = $(html);
    //the actual work
    elem.appendTo("#parentDiv");
    //elem.remove();

a js fiddle 取消注释 elem.remove() lin 以观察它的工作情况。

【讨论】：

我在这里关注绿色检查答案stackoverflow.com/questions/8437352/…，因为 HTML 是编码的。一旦解码它似乎是完全有效的（它附加得很好）。这不正确吗？
你把身份证放错地方了。应该是&lt;div id="newDiv"&gt; hello &lt;/div&gt;
使用您想要的 html 解码选项进行编辑。也测试了'&lt;div id="newDiv"&gt; world &lt;div id="innerDiv"&gt;!&lt;/div&gt;&lt;/div&gt;'。

【解决方案2】：

只要将 id 放在正确的位置，效果就会很好：

var myString = '&lt;div id="newDiv"&gt; hello &lt;/div&gt;';

http://jsfiddle.net/NN9v2/1/

【讨论】：