大家先自己想一想已下代码会输出什么？
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<script type="text/javascript">
function abc(){
var ele = document.getElementById("a");
console.log(ele);
}
window.onload=abc();
window.onload=function () {
console.log("jmycanfly!");
}
</script>
</head>
<body>
<input type="text" id="a" value="jmy" name="">
</body>
</html>
很奇怪吧，输出结果为null和jmycanfly。为了说明为什么会输出这样的结果我们有三个问题需要说明。window.onload,函数赋值和文档树加载。
首先window.onload。
window.onload是一个事件，当文档加载完成之后就会触发该事件，可以为此事件注册事件处理函数，并将要执行的脚本代码放在事件处理函数中，于是就可以避免获取不到对象的情况。
我们也可以把onload理解为window对象的一个属性，也就是一个变量。所以window.onload只能允许一次赋值，不然后面的赋值函数会覆盖掉前面的。想要多次使用，其实也是有办法的。看下面代码：
function _addLoadEvent(func)
{
var oldonload=window.onload;
if(typeof window.onload != 'function')
{
window.onload=func;
}
else
{
window.onload=function()
{
oldonload();
func();
}
}
}
其实就是不直接将函数赋值给window.onload,而是采用调用函数_addLoadEvent（）。
回到我们的问题，既然window.onload会被覆盖，那为什么会有“null”输出呢？
其次是函数赋值。看下面代码：
var jmy = abc;//将函数abc赋值给jmy
var jmy1 = abc();//将函数abc的执行结果赋值给jmy1
那现在就好解释了，window.onload的确被覆盖了，但它覆盖的是abc（）函数执行后的返回值，这里的返回值是null。
window.οnlοad=abc();//调用函数abc，然后再将abc的返回值赋值给window.onload。
最后文档树。
其实就是解决为什么会输出”null”，js代码是放在head里面的，会先执行，此时body还没被加载，肯定会是null呀。
综上所述：
1. JS文件最好放在文档的末尾，也就是body的末尾。
2. 用JQ框架吧，别用什么window.onload,解决冲突听麻烦的。
+function ($) {
//content
}(window.jQuery);
![datatable插件应用于tab切换出现表头错位问题[图]](data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACwAAAAAAQABAAACAkQBADs=)