document.getElementById return NULL when the control only have name attribute

A webpage was working well on the development machine but when I moved it to the server the document.getElementById returned null. Here an example:

<script>
alert(document.getElementById(“test”));
</script>

<body>
<input name=”test” type=”text” value=”testing..”>
</body>

The above alert should show the message “[object]” but it returns null. After few hours of troubleshooting it turned out that the webpage contained a wrong doctype tag which is:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

Then by changing the doctype tag to ver 4.0 (as below) everything worked well:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

Add a Comment