The simplest way to avoid namespace clashes in JavaScript if you don't jumble the JavaScript with the HTML as you have in your example is to wrap all of the code for a script inside an anonymous function so as to effectively create a separate unnamed namespace for that script. Only library references need to use global variables so as to be accessible to multiple scripts in the page.
For example:
Code:
(function() {
// all your code goes here
})();
or if you use JQuery then the following leaves just jQuery as the only global variable while you use $ inside your code to reference it.
Code:
jQuery.noConflict();
(function($) {
// all your jQuery code goes here
})(jQuery);
Where you don't keep all the JavaScript together and instead jumble it with the HTML the way you used to have to do it for Netscape 4 and earlier then setting up a namespace like you have will at least minimize clashes with other scripts in the page - but it will mean that if you have the same piece of HTML on multiple pages and some have one script that references a tag and some have two then the JavaScript embedded in the HTML will need to be different depending on which scripts are attached to the page - so there is still the possibility for script clashes in the part of the script that is in the HTML file instead of in the JavaScript.
To avoid such clashes you should replace the JavaScript code in the HTML with an id attribute and then add code into the separate JavaScript to run the code you removed from the HTML but using an event listener rather than an event handler - so that having a second script add code for the same event will not cause a clash.
With the code you currently have using the namespace simply adding a second script that contains the following statement would break the first script even with it using a namespace - because the event processing is outside the namespace.
Code:
document.getElementsByTagName('input')[0].onclick = function() {alert('not hello');};