当使用jQuery插入DOM时,JavaScript不会执行

JavaScript is not executed when inserted in DOM with jQuery

本文关键字:JavaScript 执行 DOM jQuery 插入      更新时间:2023-09-26

EDIT:filter()严重错误。将其更改为find(),但问题仍然存在。

这个代码对我有效:

$('#content')
   .replaceWith($(
      '<div>
       <div id="content"> Hello <script type="text/javascript"> alert(123); </script>
       </div>
       </div>
      '));

但事实并非如此:

$('#content')
   .replaceWith($(
      '<div>
       <div id="content"> Hello <script type="text/javascript"> alert(123); </script>
       </div>
       </div>
      ').find('#content'));

唯一的区别是,在第二个例子中,我只想过滤HTML的一部分,然后将其插入DOM。

有什么想法吗?谢谢

编辑3:添加解决方案作为答案

这对我有效:

var newElements = $('<div><div id="content"><script>alert(123)</script></div></div>');
if (newElements.length > 1) {
  for (var i = 1; i < newElements.length; i++) {
    $('body').append(newElements[i]);
  }
}
$('#content').html(newElements.find('#content').html());

原因是在第一次调用中创建元素时,会对所有脚本标记进行排序,并将它们放入一个数组中。

console.log($('<div><div id="content"><script>alert(123)</script></div></div>'));

结果:

[div, script]

很明显,当将.find()应用于该数组时,脚本标记会丢失。