五、JS对象和jQuery对象:
用jQuery选择器查出来的就是jQuery对象。
- jQuery对象:可以使用jQuery方法,不能使用原生JS的方法。
$("#div").click(function(){}); // 正确 $("#div").onclick = function(){}; // 错误,JQuery对象不能调用原生JS方法
DOM对象(js对象)和jQuery对象转换:
- jQuery转JS:使用.get(index) 或 [index] 选中的就是JS对象,例如:
$(".c1").get(0)
或$(".c1")[0]
- JS转jQuery:使用$()包裹JS对象。
$(DOM/JS对象)
- jQuery转JS:使用.get(index) 或 [index] 选中的就是JS对象,例如:
六、解决jQuery多库冲突问题:
页面中如果同时引入多个JS框架,可能导致$冲突。
解决办法:
① 使用jQuery.noConflict();使用JQuery放弃在全局中使用$;
② 使用jQuery关键字替代$,或者使用一个自执行函数:
!function($){ // 在自执行函数中,可以使用$替代jQuery // 除自执行函数外的其他区域,禁止jQuery使用$ }(jQuery);
示例:
jQuery.noConflict(); !function($){ $(function(){ // JS转JQuery var div = document.getElementsByTagName("div"); $(div).click(function(){ alert(1); }); // JQuery转JS $("div").get(0).onclick = function(){ alert(1); } }); }(jQuery);