关于jQuery和js的区别

jq的预加载？

  ①页面加载完之前执行，与嵌入的js加载方式一样(写jquery插件的时候使用)

(function ($) {

    alert('start');

})(jQuery);

②页面加载后执行。

$(document).ready(function(){

    alert('jquery ready');

});

③页面加载后执行。

$(function(){

    alert('jquery onload');

});

④页面加载后执行。

jQuery(function($) {

    alert('jQuery ready ');

});

与window.onload 区别？

window.onload()：

加载时机：必须等待网页全部加载完毕（包括图片等），然后再执行JS代码；

执行次数：只能执行一次，如果第二次，那么第一次的执行会被覆盖；

  $(document).ready()：

加载时机：只需要等待网页中的DOM结构加载完毕，就能执行JS代码；

执行次数：可以执行多次，第N次都不会被上一次覆盖；

简写：$(function () {})；

 

2.jq与js对象的互相转换；

1. DOM 对象转成 jQuery 对象

对于已经是一个 DOM 对象，只需要用 $() 把DOM对象包装起来，就可以获得一个 jQuery 对象了，$(DOM 对象) ；

2. jQuery 对象转成 DOM 对象

两种转换方式讲一个 jQuery 对象转换成 DOM 对象： [index] 和 .get(index)；

jQuery 对象是一个数据对象，可以通过 [index] 的方法，来得到相应的 DOM 对象。

jQuery 本身提供，通过.get(index) 方法得到相应的 DOM 对象；

3.jq的链式调用什么意思？

节约JS代码；所返回的都是同一个对象，可以提高代码的效率；通过简单扩展原型方法并通过return this的形式来实现跨浏览器的链式调用。利用JS下的简单工厂方法模式，来将所有对于同一个DOM对象的操作指定同一个实例。

4.jq的事件监听

1.bind：

bind(type,[data],function(eventObject))  bind是使用频率较高的一种，作用就是在选择到的元素上绑定特定事件类型的监听函数，

参数函数如下：

type:事件类型，如click、change、mouseover等；

data:传入监听函数的参数，通过event.data取到；

function:监听函数，可传入event对象，这里的event是jquery封装的event对象。

2.live

live(type, [data], fn)   live的参数和bind一样，它又有什么蹊跷呢，我们还是先瞄一眼源码：

live: function( types, data, fn ) {

    jQuery( this.context ).on( types, this.selector, data, fn );

    return this;

}

可以看到live方法并没有将监听器绑定到自己(this)身上，而是绑定到了this.context上了。通过 live() 方法添加的事件处理程序适用于匹配选择器的当前及未来的元素（比如由脚本创建的新元素）,使用事件委托的优点一目了然，新添加的元素不必再绑定一次监听器。

注意：live方法在在 jQuery 版本 1.7 中被废弃，在版本 1.9 中被移除，官方建议使用on代替。

3.delegate

将监听事件绑定在就近的父级元素上，源码:     

delegate: function( selector, types, data, fn ) {       

    return this.on( types, selector, data, fn );    

}

delegate() 方法为指定的元素（属于被选元素的子元素）添加一个或多个事件处理程序，并规定当这些事件发生时运行的函数。

这下，我们的选择又多了一些灵活性，不单可以利用事件委托，还可以选择委托的对象。代码，实现效果，点击div，两个p标签的文字颜色都发生变化。

4、on

on(type,[selector],[data],fn)参数与delegate差不多但还是有细微的差别，首先type与selector换位置了，其次selector变为了可选项。

on() 方法在被选元素及子元素上添加一个或多个事件处理程序。

自 jQuery 版本 1.7 起，on() 方法是 bind()、live() 和 delegate() 方法的新的替代品。代码，实现效果同上，把delegate改为on，第一个参数为click，第二个参数p可写可不写，第三个参数同上。

5.jq的on 、live、delegat、bind 区别？

相同点：

1.都支持单元素多事件的绑定；空格相隔方式或者大括号替代方式;

2.均是通过事件冒泡方式，将事件传递到document进行事件的响应；

比较和联系:

1.bind()函数只能针对已经存在的元素进行事件的设置；但是live(),on(),delegate()均支持未来新添加元素的事件设置；

6.jq的ajax

7.如何解决$符号的冲突？

方案1：引入noConflict(),将$替换为其他符号

代码如下:

var $j = jQuery.noConflict();

$j(document).ready(function(){

    $j("#btn1").click(function(){

        alert("Text: " + $j("#test").text());

    });

});

缺点：引入了这段代码后，不仅是当前的js文件，该html引用的所有js中，如果有用到jquery中的$，都得用$j来代替之前的$ ；

方案2：

ready函数是jquery的入口函数，可以将

$(document).ready(function(){})

替换成

jQuery( document ).ready(function( $){}

缺点：只对ready嵌套内的代码有效，对嵌套外的代码是无效的。如果你所有的逻辑，都在写ready函数中，那没问题。但我们一般都会在ready函数之外写一些子函数，然后ready函数再去调用这些函数。这个方案对这些函数是无效的，因此这套方案有局限性。

方案3（推荐，特别是开发js插件时）：

给js内容包上一个函数

代码如下:

jQuery(function($){

//你的js代码放在这里（例如第二个方案提到的ready函数和子函数）

//如果是js文件，其实就是在文件头部和尾部各加一行代码

}

或者代码如下:

(function($) {

//你的js代码

})(jQuery);

8.jq需不需要做兼容？

jQuery新版本已经不再进行IE低版本(IE6、IE7、IE8)的兼容性处理。

如果项目需要兼容IE低版本，需要使用jQuery1.x版本，从2.x开始已经不兼容IE6、7、8了。

9. jq.js和jq.min.js 区别  开发时用那种 上线后用那种

1、jquery的不同的下载方式。2、文件名不完全相同

一、区别：

1.jquery.min.js：是由完整版的jQuery库经过压缩得来，压缩后功能与未压缩的完全一样，只是将其中的空白字符、注释、空行等与逻辑无关的内容删除，并进行一些优化。

2.jquery.js：是完整的未压缩的jQuery库，文件比较大。

二、应用：

1、jquery.min.js（上线后）：这个版本一般用于网站引用使用，减小文件体积，降低网站流量，提升访问速度等。

2、jquery.js（开发时）：一般用于阅读学习源码或修改源码，一般不用于线上项目。