javascript代码不是放哪里都可以的吗?为什么在这必须放html后面?

javascript代码不是放哪里都可以的吗?为什么在这必须放html后面?

放到html前面就不能执行,为什么?
为什么有的代码可以前后都行?

<input id="file" type="file" />
  <img id="preview" />

<script>
var file = document.getElementById('file');
var preview = document.getElementById('preview');

file.addEventListener('change', function() {  
  preview.src = URL.createObjectURL(this.files[0]);
}, false);
</script>
回复
阅读 3.3k
3 个回答

加载顺序问题,你这样写 放在前面 后面的dom 还没有生成,当然不能执行了,

这是因为浏览器在获取到服务器返回的代码时是按照顺序执行的,所以如果html的dom树还没有完全生成,你执行js的时候,就会出现无法读取到某些元素的情况,这样js代码也就无法执行了。

一般回将一些js类库,如jquery放在<head>和<body>之间,因为body中的html可能会用到一些js的滚动框之类的代码,再在<body>后加载哪些个性化的js代码。这样做的好处是可以加快页面的加载速度,先把重要的dom框架和必要的js加载,然后再去执行一些前端的效果。

var file = document.getElementById('file');

你的JS代码是通过Id元素为file找到input框。如果你的Dom还没有加载完,就去找Id为file的input框就会出错

宣传栏