Remove javascript tags from header using javascript

Question

Suppose I have a main page that uses an iframe object as a buffer to load an external page from the same domain (for security reasons). I chose this method because XMLHttpRequest is not able to parse from string external xhtml content in all browsers.

After the content has been loaded in the iframe, I "steal" it's content using the "contentDocument" property and then append all the css styles and script-tags to the parent's header and eventually delete the iframe (note that CSS and scripts are inline in the second document, so no external links at all).

Now everything works great - I can call the new javascript functions and css works as well.

My question is: I am able to manage removing the newly appended css styles, but with javascript does not work. Is there any solution to remove the header's newly added script tags from within the same document?

I even tried this in desperation (css vanishes, javascript still remains...)

    function emptyheader()
    {
        /* var container = document.getElementById("container"); */

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

        /* styles = header.getElementsByTagName('style'); */
        /* scripts = header.getElementsByTagName('script'); */

          while(header.hasChildNodes())
          header.removeChild(header.firstChild);    
     }

am sure i saw the same question before here in stack over flow please search more — shareef
– shareef, Commented Jun 22, 2012 at 18:59
Once your Javascript runs, "removing" it won't undo what it did. — Joseph Silber
– Joseph Silber, Commented Jun 22, 2012 at 19:00
I don't want it to undo what it did, I just want to remove the script children from the header once i don't need them. — Dragos
– Dragos, Commented Jun 22, 2012 at 19:10
do you mean 'Remove script from other frame with source on other domain ?' yes or no — shareef
– shareef, Commented Jun 22, 2012 at 19:21
I want to remove the scripts I loaded from the iframe. Analogy in C++: *my_object = new object() --- do something with the object --- delete (my_object) — Dragos
– Dragos, Commented Jun 22, 2012 at 19:24

user1087110 · Accepted Answer · 2012-06-22 19:26:28Z

1

I am not shore I understand what you mean. But here is an example of how you can add and then remomve a script (as far as I know it is okey to add script tag to body).

<script>
function addAndRemoveScript() {
    var a = document.createElement("script");
    a.src = "yourscript.js";
    document.body.appendChild(a);
    document.body.removeChild(document.body.getElementsByTagName("script")[0])
    document.body.removeChild(document.body.getElementsByTagName("script")[0])
}
window.onload = addAndRemoveScript();
</script>

answered Jun 22, 2012 at 19:26

user1087110

3,78311 gold badges38 silver badges43 bronze badges

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

5 Comments

Dragos Over a year ago

No, the scripts are NOT external, they are inline in the second document - as I already mentioned. I want to load an external document with both css / javascript embedded and then to be able to remove both when not needed.

user1087110 Over a year ago

It was just an example of how you can add and remove a script TAG from the HTML. Tough the javascript will still work (because it's in the DOM) and I see now that this is your problem... For that I have no solution (i don't think it is possible to disable it once it's there).

Dragos Over a year ago

I see, but isn't it ironic? You are allowed to remove exernal scripts - as per your example, but you are not allowed to remove inline scripts :(

user1087110 Over a year ago

Dragos Dutu, you can remove any script TAG with this technique, even inline scripts (note that I say TAG). The thing is, once loaded the javascript will work any way, even if the script tag is removed. Maybe you are better of keeping the extearnal page in the iframe with a absolute/fixed positioned menu on top of it. Then you reload the iframe with the new page.

Dragos Over a year ago

Yes, you are perfectly right. I was just hoping there might be another solution/technique one can make use of. But the trouble with iframes is that when you embed them into some draggable windows (may be div, or table or whatsoever), then the drag process becomes veeeeeeeeeeeery slow, because the browser must instantiate the iframe in a separate context. I've been looking for alternatives for years, there seem to be no other ways to do that except iframe/object which is - like i said - the worst alternative.

Collectives™ on Stack Overflow

Remove javascript tags from header using javascript

1 Answer 1

5 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

5 Comments

Your Answer

Sign up or log in

Post as a guest

Related