附加一个HTML字符串+；元素的Javascript会导致奇怪的行为

有一个包含HTML和Javascript的Javascript变量会在结果窗口中引起一些奇怪的现象。调用

appendTheString（）

的按钮和调用

springAnAlert（）

的按钮都不起作用

我希望这把小提琴会将新的

babby

div附加到

foo

div，以及会导致警报框显示

babby

div中的按钮的脚本被按下。

脚本中不能有

，因为

结束了脚本。即使是在引号里

因此，答案是将字符串切成几段，其中没有一段包含完整的结束标记

function append() {
    var stringToAppend = "<"+"div class='babby'>The Babby Div!<"+
        "/div><script>alert('This alert never happens!');<"+"/script>";
  $('.foo').append(stringToAppend);
}

函数append（）{
var stringToAppend=“Babby Div！警报（'此警报永远不会发生！'）；”；
$（'.foo'）.append（stringToAppend）；
}

更新小提琴：

---

编辑：哦，我看到评论中已经给出了完全相同的解决方案。但我发誓，在我公布这个答案之前，我从来没有看到过这个评论

这把小提琴也许是你想要的。

$（“#按钮”）。单击（函数（）{
$（'.foo'）.append（“Babby Div！\alert（1）；\”；
});
window.showAlert=函数（）{
$（'.foo'）.append（“Babby Div！\alert（2）；\”；
}

您的JSFIDLE被破坏：javascript被插入html源代码中，并解析js代码中的

。这里是正确的版本：在这里看到它的工作（没有包装）：什么！？为什么有人希望它解析那个标记，即使它在引号中？非常感谢。解析器不知道哪些字符是引号，哪些不是引号。它也不知道javascript注释之类的东西。事实上，它根本不解析内容；它只知道脚本元素以

结尾。。。一种是将脚本的内容放在

块中，就像jsfiddle站点所做的那样。然而，
块是一种XML特性，所以它们不能在HTML中工作，只能在XHTML中工作！人们往往会忘记这一点，太复杂了。我有一个类似于上面的
stringToAppend
的变量，但是我使用jQuery的.ajax（）函数得到它，所以我不确定在这种情况下如何编辑
。如果它是从其他地方得到的变量，则没有问题。引起问题的只是脚本文本中的文本字符串
（准确地说，是任何结束标记）。
$("#button").click(function () {
   $('.foo').append("<div class='babby'>The Babby Div!</div>\<script\>alert(1);\<\/script\>");
});
window.showAlert = function(){
   $('.foo').append("<div class='babby'>The Babby Div!</div>\<script\>alert(2);\<\/script\>");
}