Removing a javascript from a html page dynamically

Question

I have dynamically loaded a javascript by using :

  var fileref=document.createElement('script')

  fileref.setAttribute("type","text/javascript")

  fileref.setAttribute("src", "../scripts/sample.js");

  $("head").append(fileref);

Now to remove/unload the script the reverse doesr not work as a script once executed in a browser cannot be removed.

Is there a solution/workaround to this.?

what did you use to remove? And after appending, why you want to remove it again? — Bhojendra Rauniyar
– Bhojendra Rauniyar, Commented Sep 9, 2014 at 5:04
after remove the appended script you should set to null all object instance and appended event handlers — invernomuto
– invernomuto, Commented Sep 9, 2014 at 5:06
No. Once a script is loaded, the objects and functions it defines are kept in memory. Removing a script element does not remove the objects it defines. — vikrant singh
– vikrant singh, Commented Sep 9, 2014 at 5:07
The script is clashing with other scripts loaded and therefore needs to be removed after a certain functionality. — Dev
– Dev, Commented Sep 9, 2014 at 5:07
It's not going to stop clashing just because you remove the script element. — recursive
– recursive, Commented Sep 9, 2014 at 5:08

Kartikeya Khosla · Accepted Answer · 2014-09-09 05:51:05Z

1

You can remove elements using removeChild:

var head = document.getElementsByTagName('head')[0];

//removing it from the head, where you added them
head.removeChild(script);

OR

As per your explanation in comments section try this solution :-

var fileref=document.createElement('script');

fileref.setAttribute("type","text/javascript");

fileref.setAttribute("src", "../scripts/sample.js");

fileref.setAttribute("id","scid");         //<-------add 'id' to script

$("head").append(fileref);

and then remove script with id as shown :

var element = document.getElementById("scid");
element.parentNode.removeChild(element);

edited Sep 9, 2014 at 5:51

answered Sep 9, 2014 at 5:05

Kartikeya Khosla

18.9k8 gold badges46 silver badges70 bronze badges

Sign up to request clarification or add additional context in comments.

7 Comments

Dev Over a year ago

The elements are once loaded in the browser are still there so the remove Child did not work.

Kartikeya Khosla Over a year ago

@user3713816..try using single quotes as head.removeChild('script');

Dev Over a year ago

i am using id instead of 'script' as there are more than one script in head and i only want to remove 1

Kartikeya Khosla Over a year ago

@user3713816..plz update question and make clear what you actually want..above answer will work fine..

Dev Over a year ago

the above method did'nt work....even after removing the script tag, the elements are still loaded in browser memory hence clash happens

|

Bhojendra Rauniyar · Accepted Answer · 2014-09-09 05:09:35Z

0

You can remove the script like this:

$('script[src$="sample.js"]').remove();

answered Sep 9, 2014 at 5:09

Bhojendra Rauniyar

86k36 gold badges179 silver badges241 bronze badges

Comments

A.J. · Accepted Answer · 2014-09-09 05:56:34Z

0

Easier to do it with jquery.js

1. Remove all Scripts

$('script').remove()

OR

2. Remove Specific Scripts

$('script').each(function(node){
   if (node.src == 'abc.js'){ # Check whether or not you want to remove it. 
       node.remove();
   }
}

answered Sep 9, 2014 at 5:56

A.J.

9,12613 gold badges66 silver badges91 bronze badges

Collectives™ on Stack Overflow

Removing a javascript from a html page dynamically

3 Answers 3

7 Comments

Comments

1. Remove all Scripts

OR

2. Remove Specific Scripts

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

7 Comments

Comments

1. Remove all Scripts

OR

2. Remove Specific Scripts

Comments

Your Answer

Sign up or log in

Post as a guest

Related