We've been having a discussion at our workplace on this with some for and some against the behavior. Wanted to hear views from you guys :
<html>
<body>
<div>
Test!
<script> document.body.removeChild(document.getElementsByTagName('div')[0]); </script>
</div>
</body>
</html>
Should the above script work and do what it's supposed to do? First, let's see what's happening here :
I have a javascript that's inside the <div>
element. This javascript will delete the child node within body which happens to hold the div inside which the script itself exists.
Now, the above script works fine in Firefox, Opera and IE8. But IE6 and IE7 give an alert saying they cannot open the page.
Let's not debate on how IE should have handled this (they've accepted it as a bug and hence fixed it in IE8). The point here is since the 'SCRIPT' tag itself is a part of DOM, should it be allowed to do something like this? Should it even exist after such an operation?
Edit:
Firefox, Opera, IE9 etc. do not remove the 'script' tag if I run the above code. But, document.getElementsByTagName('script').length returns 0!
To understand what I mean, add alert(document.getElementsByTagName('script').length);
before and after document.body.removeChild(document.getElementsByTagName('div')[0]);
in the code above.
One of the things that annoys me tremendously about HTML is that you can't write a self-closing script tag. E.g. is invalid. The <script> element is not allowed to be empty because it may contain inline code, and HTML is not smart enough to turn that feature on or off based on the presence of an attribute.
That's because SCRIPT TAG is not a VOID ELEMENT. In an HTML Document - VOID ELEMENTS do not need a "closing tag" at all! In xhtml, everything is Generic, therefore they all need termination e.g. a "closing tag"; Including br, a simple line-break, as <br></br> or its shorthand <br /> .
When the browser encounters script elements it will work to download those in the order they appear, and it will avoid rendering further content until after those scripts are downloaded in case they need to be present first. This a blocking operation, unlike e.g. a reference to an image.
The script tag should always be used before the body close or at the bottom in HTML file. The Page will load with HTML and CSS and later JavaScript will load.
An example where self removal can be handy is, for example, some long polling techniques that would certainly make the DOM large after a few minutes.
JavaScript frameworks add and remove script elements as part of their daily routine.
E.g. getScript()
in jQuery places a script tag in the document head and removes it right after evaluation.
They do this to keep the DOM clean - else the tags would just build up unnecessarily. They are no longer needed after evaluation.
The only drawback I see with this is debugging - for example, Firefox with Firebug seems to be lost as to the whereabouts of such scripts and cannot find the source lines. (As of this writing.)
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With