TypeError: document.getelementbyid(...) is null

JavaScript
1 
<html>

	<head>
		<title>Port Scanner for Mozilla Firefox</title>
	</head>
	
	<body>

		<form name="my_form" id="my_form" method="post" action="#" onsubmit="return displayMessage();">
			<p align="center">URL/Domain Name/IP Address: <input type="text" size="20" name="uri" value="" placeholder="http://www.google.com" required/></p>
			<table align="center" border="1" width=100% bgcolor="#f4fff0" bordercolor="green" cellspacing="2" cellpadding="2">
				<tr>
					<td align="center">
						Start port: <input type="text" size="5" name="start_port" maxlength="5">
						End port: <input type="text" size="5" name="end_port" maxlength="5"><br>
						<input type="submit" value="Scan all ports" name="scan_all"><br>
						<input type="submit" value="Scan only open ports" name="scan_open">						
					</td>
				
				</tr>
				<tr>
					<td align="center">
						<input type="text" size="20" name="scan_tcp"><br>
						<font color="#b1b1b1">Enter port numbers separated by space. (e.g. 21 25 80)</font><br>
						<input type="submit" value="Scan TCP ports" name="scan_tcp_ports">					
					</td>
				</tr>
				<tr>
					<td align="center">
						<input type="submit" value="Scan common service ports" name="scan_common_tcp"><br>
						<input type="submit" value="Scan common Trojan ports" name="scan_common_trojan_tcp">					
					</td>
				</tr>
			</table>
		</form>
	    <script type="text/javascript">
			function displayMessage()
			{
					if(document.my_form.uri.value==0)
					{
						document.write("<font color='red'><i>Please enter URL/Domain Name/IP Address.</i></font>");
						return false;
					}
					document.write("<DIV id='loading'><BR><BR><font color='#FF6600'><i>Please wait... The ports are being scanned...</i></font></DIV>");
					document.getElementById("my_form").submit();					
			}
		    window.onload=function()
			{  
				document.getElementById("loading").style.display="none";  
		    }  
		</script>
	</body>
</html>

I want to submit above form. But it shows me JavaScript error in Console that
“TypeError: document.getelementbyid(…) is null”
This error is for code :
document.getElementById(“my_form”).submit();

I am using Firefox 24.0 and Windows 7. I have installed only 1 add-on. That is ‘Firebug 1.12.3’.
This code works fine for other browsers Except Firefox.
Please help me to solve this problem.

2

This is because document.write will overwrite the entire DOM if it’s called after the document has finished being parsed.

Once I have submitted the form, see the “loading” message, then inspect the DOM using FireBug, I see:

<html>
  <head></head>
  <body>
    <div id="loading">
      <br><br><font color="#FF6600"><i>Please wait... The ports are being scanned...</i></font>
    </div>
  </body>
 </html>

hence why document.getElementById("my_form") is null.

It would be better to create a <div> element, set the text accordingly, then append it to your form.

HTH

3

Thank you very much for help.
I could solve this error by using ‘innerHTML’.