1、还是要记录一下JQ中的$(document).ready()和JS中的window.onload()方法的差别。 window.onload()方法是在网页所有元素（包括关联的一些文件）都完全加载在浏览器之后才会执行的。而$(document).ready()从所有DOM元素准备就绪时就可以执行了，此时并不一定所有的元素都已经加载完成。

这好比有一个图片展示页面，当你打开之后要慢慢的等所有图片都加载完之后才能进行操作，这就是window.onload()；而$(document).ready()是在图片未全部加载完的情况下就已经可以进行操作了，这时可能会觉得图片都还没加载好。不过对于用户来说速度就比前一个快多了。那如果这时对其进行操作，例如获取图片的属性什么的，不是会出错。是的，会获取不到。但是JQ针对这个问题，给出了load()方法，它会在指定的元素（或窗体）下绑定一个处理函数，当指定的元素（或窗体）的内容加载完毕之后才会触发。

2、关于层的显示与隐藏

这一个效果在很多网页中都有用到。这里学学是如何用JQ完成的吧。
<div id="panel">
             <h5 class="head">点击我！</h5>
             <div class="content">
                 这时显示与隐藏的层所在。你看到了吗？再点击一个标题吧！</div>
</div>
JQ:
$(function(){
        $("#panel h5.head").toggle(function(){
                $(this).next().show();
        },function(){
                $(this).next().hide();
  })
})

如果要让效果好看一点，可以加上一个速度参数。
如：
$(function(){
                $("#panel h5.head").toggle(function(){
                                $(this).next().show(2000);
                },function(){
                                $(this).next().hide(2000);
    })
})
此时的动画效果就好看多了。

3、可以用toggle()来代替show()和hide()方法，同样实现显示与隐藏。
$(function(){
        $("#panel h5.head").click(function(){
            $(this).next().toggle();
  })
})
以上代码就简化了很多。