Load and unload javascript at runtime

Question

Can I add or remove JavaScript files and JavaScript CSS files at runtime? If this is not possible for JavaScript, can we do this using PHP or any other site language?

Actually, I tried to use yep-nope js, but I cannot upload any javascript.

Answer 1

Check this , this and this

From the top link to dynamically add js or css:

function loadjscssfile(filename, filetype){ if (filetype=="js"){ //if filename is a external JavaScript file var fileref=document.createElement('script') fileref.setAttribute("type","text/javascript") fileref.setAttribute("src", filename) } else if (filetype=="css"){ //if filename is an external CSS file var fileref=document.createElement("link") fileref.setAttribute("rel", "stylesheet") fileref.setAttribute("type", "text/css") fileref.setAttribute("href", filename) } if (typeof fileref!="undefined") document.getElementsByTagName("head")[0].appendChild(fileref) } loadjscssfile("myscript.js", "js") //dynamically load and add this .js file loadjscssfile("javascript.php", "js") //dynamically load "javascript.php" as a JavaScript file loadjscssfile("mystyle.css", "css") ////dynamically load and add this .css file 

Also, to dynamically remove js or css:

 function removejscssfile(filename, filetype){ var targetelement=(filetype=="js")? "script" : (filetype=="css")? "link" : "none" //determine element type to create nodelist from var targetattr=(filetype=="js")? "src" : (filetype=="css")? "href" : "none" //determine corresponding attribute to test for var allsuspects=document.getElementsByTagName(targetelement) for (var i=allsuspects.length; i>=0; i--){ //search backwards within nodelist for matching elements to remove if (allsuspects[i] && allsuspects[i].getAttribute(targetattr)!=null && allsuspects[i].getAttribute(targetattr).indexOf(filename)!=-1) allsuspects[i].parentNode.removeChild(allsuspects[i]) //remove element by calling parentNode.removeChild() } } removejscssfile("somescript.js", "js") //remove all occurences of "somescript.js" on page removejscssfile("somestyle.css", "css") //remove all occurences "somestyle.css" on page 

But note the removal:

So what happens when you delete external JavaScript or a CSS file? Perhaps not quite what you really expect. in the case of JavaScript, while the element is removed from the document tree, any code loaded as part of the external JavaScript file remains in the browser memory. That is, you can still access the variables, functions, etc. that were added when the first external file was loaded

Answer 2

No, you cannot do this. As soon as the JavaScript block is loaded into the browser and executed, it is stored in the browser memory within the corresponding window. Unable to unload it (without refreshing the page / closing the window).

In max, all you can do is set the variables that were included in your javascript file to Null. But again, this will not fix the problem completely, but yes, any further access to these variables will not work.

Answer 3

Can I add or remove JavaScript files and JavaScript CSS files at runtime?

You can load JavaScript dynamically, but once you have loaded it, you will not be able to download JavaScript on the active page. You can reload the page, which will clear the active scripts and start over. Alternatively, you can override the functions you set.

As for CSS, you can add / remove <link.../> elements to add / remove stylesheets. In addition, you can add / remove <style> elements that may contain rules.

You can also use DHTML to change any inline element styles on the page.