最近在學習javascript的過程中碰到一個這樣的問題。 先貼出代碼
1 <html> 2 <head> 3 <script type='text/javascript'> 4 var txt=document.form1.txt; 5 function btn_onclick(){ 6 txt.value='123'; 7 } 8 </script> 9 </head>10 <body>11 12 <form name='form1' action=''>13 <input type='text' name='txt'/>14 <input type='button' value='button' name='btn' 15 onclick='btn_onclick()'/>16 </form>17 </body>18 </html>
測試用的是Opera瀏覽器。在opera 的控制台會拋出一個這樣的錯誤“Cannot convert 'document.form1' to object”。
但是如果把JS放在body部分就沒有問題了。js放在body和head是不同的前者是對js進行載入和執行,而後者只是進行載入。
解決辦法很簡單:
1、var txt=document.form1.txt; 放到body中。
2、var txt=document.form1.txt;放到function中。
這裡還存在另一個問題,可以給文字框增加一個id='test' 並且用var txt=document.getElementById('test');替代原來的代碼。這樣控制台就不會報錯了。 為什麼 document.form1 不可以而document.getElementByid()可以呢?
待續.....
剛從北京照完工作回來。
從google搜尋了半天,也沒找到答案,後來用IE和Chrome分別測試了一下。用var txt=document.getElementById('test'); 是不可以的。所以盡量不要在head中寫這種全域變數,head中的js只載入而不執行,而body中的就不同了。即載入也執行。
另附,js在 head 和 body 的區別 http://www.irt.org/script/421.htm