当jQuery .remove()用于删除脚本标记时,它是否清除了加载的javascript?

时间:2012-03-14 11:57:40

标签: javascript jquery

正如标题所说,如果我使用以下方法从DOM中删除脚本标记:

$('#scriptid').remove();

javascript本身是保留在内存中还是已清除?

或者......我是否完全误解了浏览器对待javascript的方式?这很可能。

对于那些对我的询问理由感兴趣的人,请看:

我正在将一些常见的javascript交互从静态脚本文件转移到PHP中动态生成的交互。当用户需要时按需加载。

这样做的原因是为了移动逻辑服务器端并运行从服务器客户端返回的小脚本。客户端不是拥有包含大量逻辑的大型脚本。

这与Facebook的做法类似......

Facebook talks frontend javascript

如果我们举一个简单的对话框。而不是在javascript中生成html,将其附加到dom,然后使用jqueryUI的对话框小部件加载它,我现在正在执行以下操作。

  • 对dialog.php
  • 发出Ajax请求
  • 服务器生成特定于此对话框的html和javascript,然后将其编码为JSON
  • JSON返回给客户。
  • HTML附加到<body>,然后渲染后,javascript也会附加到DOM中。

插入后会自动执行javascript,动态对话框会打开。

这样做大大减少了我页面上javasript的数量,但我担心清理插入的javascript。

显然,一旦对话框关闭,它将使用jQuery从DOM中删除:

$('#dialog').remove();

javascript附加了一个ID,我也通过相同的方法从DOM中删除它。

但是,如上所述,使用jQuery的.remove()实际上是从内存中清除javascript还是从DOM中删除<script>元素?

如果是这样,有什么方法可以清理它吗?

2 个答案:

答案 0 :(得分:19)

没有。加载脚本后,它定义的对象和函数将保留在内存中。删除脚本元素不会删除它定义的对象。这与CSS文件形成对比,其中删除元素会删除它定义的样式。那是因为新款式很容易回流。你能想象弄清楚脚本标签创建的内容以及如何删除它会有多难吗?

编辑:但是,如果您有一个定义myFunction的文件,那么您添加另一个将myFunction重新定义为其他内容的脚本,将保留新值。如果你想保持DOM干净,你可以删除旧的script标签,但这一切都是删除它。

EDIT2:我能想到的“清理”功能的唯一真正方法是拥有一个JS文件,基本上为每个可能的对象调用delete window.myFunction,并为其他脚本文件定义。出于显而易见的原因,这是一个非常糟糕的主意。

答案 1 :(得分:4)

如果您的脚本已经执行了删除DOM元素,则不会删除它们。使用JavaScript转到任何页面,打开首选的javascript控制台并键入$(“script”)。remove()。一切都在继续。

这证明了@Kolink回答:

http://jsfiddle.net/X2mk8/2/

HTML:

<div id="output"></div>

<script id="yourDynamicGeneratedScript">
  function test(n) {
    $output = $("#output")
    $output.append("test " + n + "<br/>")
  }
  test(1);
</script>

使用Javascript:

$("script").remove();
// or $("#yourDynamicGeneratedScript").remove();

test(2);
test(3);
test(4);

function test(n) {
  $output = $("#output")
  $output.append("REDEFINED! " + n + "<br/>")
}

test(5);
test(6);
test(7);