JQuery 易混点

后台小哥虽厉害，但有时候他们总喜欢乱用==，一旦找不到解决方案，就会把我们叫过去，看他们写的乱七八糟的js…他们还会时不时问一些细节的东西，说不上来的时候，感觉有点小羞愧，故作总结如下：

_ (function() {})() vs $(function() {})
_ window.load() vs document.ready()
- 一个页面能否引用不同的JQuery版本
- JQuery ajax data传参的区别

---

(function() {})() 和 $(function() {})

$(function() {}) 是 $(document).ready(function() {}) 的简写。
(function() {})() 是立刻执行，同时也用来避免全局变量污染。

更详细的区别在这里

window.load() 和 document.ready()

window.load()  是必须等待网页内容全部加载完成（包括图片等），才会执行；
document.ready() 是DOM结构加载完成，执行，这时候可能页面的其他内容并没有加载完成

也就是后者执行要比前者早

一个页面能否引用不同的JQuery版本？

答案是肯定的！ 为了避免冲突可以使用JQuery的 noconflict 模式

<script type="text/javascript" src="http://example.com/jquery-1.1.3.js"></script>
<script type="text/javascript">
    var jQuery_1_1_3 = $.noConflict(true);
</script>
<script type="text/javascript"src="http://example.com/jquery-1.3.2.js"></script>
<script type="text/javascript">
var jQuery_1_3_2 = $.noConflict(true);
</script>

或者

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" type="text/javascript"></script>
<script>
    var $j = jQuery.noConflict(true);
</script>
<script>
    $(document).ready(function(){
        console.log($().jquery);// This prints v1.4.2
        console.log($j().jquery);// This prints v1.9.1
    });
</script>

点击查看更多说明

JQuery ajax data传参方式的区别

data:{ 'id': id , 'name':name}   
data:'id='+ id + '&name='+ name

这两种方式的区别：
如果参数中包含 & 符号，可能造成参数接收不完整 [假设 id = ‘0001’ name = ‘Jerry&John’]
第一种没有问题；第二种会把 & 符号当作参数的分隔符进行处理，得到name = ‘Jerry’,这时需要用encodeURIComponent()方法进行转义。

参照 http://stackoverflow.com