为何图片一定要放到HEAD中,才能正确显示?_Java Web开发

为什么图片一定要放到HEAD中,才能正确显示???
<HTML>
<HEAD>
<TITLE> </TITLE>
<img src= "about:blank " id= "fileChecker " alt= "test " height= "18 "/>
<script type= "text/javascript ">
var oFileChecker = document.getElementById( "fileChecker ");
function changeSrc(filePicker)
{
oFileChecker.src = filePicker.value;
}
oFileChecker.onreadystatechange = function ()
{
if (oFileChecker.readyState == "complete ")
{
checkSize();
}
}
function checkSize()
{
var limit = document.getElementById( "fileSizeLimit ").value * 1024;

if (oFileChecker.fileSize > limit)
{
alert( "too large ");
}
else
{
alert( "ok ");
}
}
</script>
</HEAD>
<BODY>
<input type= "file " name= "file1 " id= "file1 " size= "40 " onchange= "changeSrc(this) "/>
<input type= "text " size= "4 " value= "10 " name= "hndnn " id= "fileSizeLimit "/> K
</BODY>
</HTML>

这样放置运行正确,但把 <img src= "about:blank " id= "fileChecker " alt= "test " height= "18 "/> 放入BODY中时就不行了,好象是因为oFileChecker取不到值,document.getElementById( "fileChecker ")定义有错吗????

------解决方案--------------------
因为页面执行的时候是从上往下执行的，所以你把 <img src= "about:blank " id= "fileChecker " alt= "test " height= "18 "/> 放入BODY中，它就不能识别，所以会出现错误，

<HTML>
<HEAD>
<TITLE> </TITLE>
</HEAD>
<BODY>
<img src= "about:blank " id= "fileChecker " alt= "test " height= "18 "/>
<input type= "file " name= "file1 " id= "file1 " size= "40 " onchange= "changeSrc(this) "/>
<input type= "text " size= "4 " value= "10 " name= "hndnn " id= "fileSizeLimit "/> K
</BODY>
</HTML>
<script type= "text/javascript ">
var oFileChecker = document.getElementById( "fileChecker ");
function changeSrc(filePicker)
{
oFileChecker.src = filePicker.value;
}
oFileChecker.onreadystatechange = function ()
{
if (oFileChecker.readyState == "complete ")
{
checkSize();
}
}
function checkSize()
{
var limit = document.getElementById( "fileSizeLimit ").value * 1024;

if (oFileChecker.fileSize > limit)
{
alert( "too large ");