Styles

Wednesday, January 20, 2010

Html and Javascript basic practices

Developers get tempted to embed <script> tags within their html or aspx pages as shown below:

<html>
    <head>
        <title>Test Page</title>
    </head>
    <body>
        <script type="text/javascript">

            function testFunction(element)
            {
                alert(element.id);
            }

        </script>
    </body>
</html>

This inevitably creates grief when trying to debug script code, and also makes it harder to find javascript code when a new developer starts working on your application. On top of all that, maintenance starts becoming an issue.
A better example would be to separate javascript code from your web page:


// javascript file testJavascript.js

    function testFunction(element)
    {
        alert(element.id);
    }


<!-- html file testHtml.html -->
<html>
    <head>
        <title>Test Page</title>
    </head>
    <body>
        <script type="text/javascript" src="include/testJavascript.js"></script>
    </body>
</html>

No comments :