可以最后执行的js代码请放到document.ready里面
在运行程序的时候,代码是从上往下执行的,比如下面的。
<link href="style.css" type="text/css" rel="Stylesheet" />
<div>这里是正文内容</div>
<script src="jquery.min.js"></script>
<div>这里是正文内容</div>
<script src="jquery.min.js"></script>
从上面可以看出,先是引用css文件,然后显示内容,再然后引用jquery文件。
有时候,我们需要打开网页的时候,获取某个标签的内容。
但是我们会不经意的写成下面这样。
<script>
alert($(".div").html());
</script>
<div class="div">这里的内容将被alert展现。</div>
alert($(".div").html());
</script>
<div class="div">这里的内容将被alert展现。</div>
这时候弹出的提示将会是“undefined”。
原因就是,在使用alert的时候,还没有加载div出来。
所以应该将alert放到后面去。
其实最好的做法是将可以最后执行的js代码写在document.ready里面。
如下:
<script>
$(document).ready(function(e) {
alert($(".div").html());
});
</script>
$(document).ready(function(e) {
alert($(".div").html());
});
</script>
document.ready是在dom文档树加载完之后执行,但是需要注意,这里面的文档树加载完不代表全部文件加载完。