JS做放大缩小的效果时，JS为什么在HEAD中没效果？ 财富值68

2016-10-13 23:45发布

站内问答 /
5155 7 6

先上代码： //我运行的时候会取消掉注释的

<!doctype html> <html lang="en"> <head>     <meta charset="UTF-8">     <title>08work</title>   <!-- 111     <script>     window.onload = function(){         var imgElement = document.getElementById("outInPic");         imgElement.width=500;         function zoomIn(){             imgElement.width-=100;         }         function zoomOut(){             imgElement.width+=100;         }      }     </script>     --> </head> <body>     <img src="鸣人1.jpg" alt="鸣人" title="漩涡鸣人" id="outInPic" width="300">       <button onclick="zoomIn()">缩小</button>     <button onclick="zoomOut()">放大</button>     <!--  222 <script>     var imgElement = document.getElementById("outInPic");     imgElement.width=500;     function zoomIn(){         imgElement.width-=100;     }     function zoomOut(){         imgElement.width+=100;     }  </script> --> </body> </html>

百度过后说是浏览器的加载顺序，然后尝试了
window.onload = function(){}
$(document).ready(function){}
结果没什么用..
只有在将js放在body后才有用（主要是 img 后面，在button前面没关系）。

问：到底怎么做才可以让它在head中有效果... window.onload这个为什么会没效果（因为大家都说加这个就可以了）

友情提示: 此问题已得到解决，问题已经关闭,关闭后问题禁止继续编辑，回答。
7条回答
忙碌的小伟 - 这个人很懒，什么都没留下
2016-10-13 23:47

在渲染 button 时同时定义了 onclick 属性，这时 zoomIn 和 zoomOut 还没有定义，导致调用报错，按钮失效。

一周热门 更多>