當jQuery .remove（）用於刪除腳本標記時，是否清除加載的javascript？

正如標題所說，如果我刪除從DOM使用腳本標籤：當jQuery .remove（）用於刪除腳本標記時，是否清除加載的javascript？

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

是否Javascript本身保留在內存中或正在清理？

或者......我完全誤解了瀏覽器對待javascript的方式嗎？這是很有可能的。

對於那些有興趣在我的理由，要求見下文：

我將一些常見的JavaScript交互從靜態腳本文件到PHP動態生成的。當用戶需要時，它們按需加載。

這樣做的原因是爲了移動邏輯服務器端並運行從服務器返回的小腳本，客戶端。客戶端，而不是一個包含大量邏輯的大腳本。

這是一個類似的方法是什麼Facebook並...

Facebook talks frontend javascript

如果我們就拿一個簡單的對話框。不是在javascript中生成html，而是將其附加到dom中，然後使用jqueryUI的對話框小部件來加載它，現在我正在執行以下操作。

的Ajax請求以dialog.php
Server生成HTML和JavaScript特定於該對話框，然後將它們編碼爲JSON
JSON返回給客戶端。
將HTML附加到<body>，然後一旦呈現，javascript也會附加到DOM中。

javascript在插入時自動執行並且動態對話框打開。

這樣做顯着減少了我的頁面上javasript的數量，但是我擔心清理插入的javascript。

顯然一旦對話已被關閉它是從使用jQuery的DOM移除：

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

JavaScript的附加有ID和我也從DOM通過相同的方法除去這一點。

但是，如上所述，確實使用jQuery的.remove（）實際上是從內存中清理掉javascript還是簡單地從DOM中刪除<script>元素？

如果是這樣，有什麼辦法可以清理它嗎？

來源

2012-03-14 gordyr

如果你關心創建對話框JS量，你可以看看EJS。這將允許您從JS創建HTML模板。 – westo 2012-03-14 12:04:13

感謝westo，我使用JsRender進行客戶端模板化。然而，我上面提到的方法不僅適用於對話框，還適用於模板不適合的其他很多交互。也許對話的例子不是很好。 – gordyr 2012-03-14 12:08:17

否。一旦加載了腳本，它定義的對象和函數就會保存在內存中。刪除腳本元素不會刪除它定義的對象。這與CSS文件相反，刪除元素會刪除它定義的樣式。這是因爲新款式很容易重新流行。你能想象一下，研究腳本標籤創建的內容以及如何刪除它是多麼困難？

編輯：但是，如果你有一個文件定義myFunction，那麼你添加另一個腳本，重新定義myFunction到別的東西，新的價值將被保留。如果你想保持DOM清潔，你可以刪除舊的script標籤，但是這只是刪除它。編輯2：「清理」功能，我能想到的唯一的真正方法是有一個JS文件，基本上調用delete window.myFunction爲您的其他腳本文件可能定義的每個可能的對象和功能。出於顯而易見的原因，這是一個非常糟糕的主意。

來源

2012-03-14 12:00:05

確實，可悲的是我想象會是這樣。你能想到任何解決辦法嗎？或者，對於上面給出的情況，是否最好增加對話框的id並使用動態javascript鏡像的元素ID？從而確保沒有任何潛在的重複引用？或者你覺得整個方法需要重新思考？ – gordyr 2012-03-14 12:03:50

謝謝科林克 - 我剛剛看到你的編輯。所以，爲了澄清一下，如果我在新創建的#dialog元素上再次使用jQueryUI的$（'＃dialog'）。dialog（）小部件，顯然不同的javascript ......它會簡單地替換舊的？如果是這樣，這是完美的。 – gordyr 2012-03-14 12:06:16

什麼是顯而易見的原因刪除是一個壞主意？另外，垃圾回收器不會處理沒有任何引用它們的對象嗎？看起來好像會有利用垃圾收集器。 – 2014-02-20 13:45:12

如果您的腳本已經執行刪除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);

來源

2012-03-14 12:36:46 tomasmuller

感謝amamasmuller。這個例子非常感謝。 :) – gordyr 2012-03-14 12:42:45

根據情況，也許另一種方法是將您的系統構建爲單頁應用程序，例如使用Backbone.js。看看[這篇很好的文章解釋了Trello背後的架構]（http://blog.fogcreek.com/the-trello-tech-stack/）。 – tomasmuller 2012-03-14 12:47:55

當jQuery .remove（）用於刪除腳本標記時，是否清除加載的javascript？

回答

相關問題