1)$("selector").map(callback(index,domElement)); //.map()方法 用于将当前匹配元素集合中的每一个元素传入回调函数(callback)中,并返回一个新的jQuery对象,也就相当于通过该方法重组匹配集合内容。其中index是元素索引,domElement是当前索引对应的jQuery对象。
2)$("selector").not(expr); //.not()方法 用于在匹配selector元素集合中移除指定的集合,expr可以为选择器(selector)也可以是一个函数,若为选择器则在selector集合中移除符合expr的集合;若expr为一个函数,则只有当当该函数返回true时才会移除当前索引对应的jQuery对象。
3)$("selector").add(selector1[,context]); //.add()方法 该方法是在匹配元素集合中添加selectior1元素,与not()方法的作用相反。其中selector1可以是一个jQuery对象、DOM对象以及HTML标签。而可选参数context是指定要插入上下文的位置
4)$.each(object,callback(indexInArray,valueOfElement)); //.each()方法 用于遍历object数组或对象 ,其中callback是回调函数 注:该方法与$("selector").each(function(){})不同,$.each()方法可以遍历所有的的数组,而$("selector").each(function(){});只能遍历jQuery对象数组。
var array = [1,2,3,4]; $(array).each(function(index){ alert(this); }); $.each(array,function(index){ alert(this); });
5)$.contains(container,contained); //.contains()方法 用于检测一个contained对象是否包含在container对象中,若包含返回true否则返回false。
$.contains($("div")[],$("p")[0]); //检测第一个p标签是不是在第一个div标签内。
6)$.isEmptyObject(object); //.isEmptyObject()方法 用于判定一个对象是否为空(不包含任何属性的对象为空),若为空返回true
$.isEmptyObject({}); //返回 true $.isEmptyObject({foo:"bar"}); //返回false
7)$.extend(target,object1); //.extend()方法 将两个或多个对象的内容合并到第一个对象target中,以实现第一个对象的扩展并返回被修改的对象。
$.extend({foo:"aa"},{bar:"bb"}); //结果为:{foo:"aa",bar:"bb"}
8)$.browser //.browser属性 该属性可以获得当前浏览器的版本信息
if($.browser.msie) alert("浏览器是IE:"+$.browser.version); if($.browser.mozilla) alert("浏览器是Firefox:"+$.browser.version);
9)$.support //.support属性 该属性用于战士不同浏览器各自特性和bug的集合
10).parent() 方法允许我们在 DOM 树中搜索这些元素的父元素,沿 DOM 树向上遍历单一层级。
.parents() 方法允许我们在 DOM 树中搜索这些元素的祖先元素,并用从最近的父元素向上的顺序排列的匹配元素构造一个新的 jQuery 对象。元素是按照从最近的父元素向外的顺序被返回的。
$(e.currentTarget).parent("ul")//查看父元素,满足条件返回结果,不满足返回为空 $(e.currentTarget).parents("ul")[0]//返回所有满足条件的祖先元素,[0]表示获取距离最近的一个结果
11)判断数组元素位置
$(".js-groupStarResultList:visible").find(".flex-control-nav li a").index($(".flex-active"));
12)在jQuery 1.4.2中,delegate和undelegate选项
//被引入代替live,因为它们提供了更好的上下文支持
//例如,就table来说,以前你会用
//例如,就table来说,以前你会用
//.live() $("table").each(function () { $("td", this).live("hover", function () { $(this).toggleClass("hover"); }); }); //现在用 $("table").delegate("td", "hover", function () { $(this).toggleClass("hover"); });
13)克隆一个元素
var cloned = $('#somediv').clone();
14)在jQuery中如何使用.siblings()来选择同辈元素
// 不这样做 $('#nav li').click(function () { $('#nav li').removeClass('active'); $(this).addClass('active'); }); //替代做法是 $('#nav li').click(function () { $(this).addClass('active').siblings().removeClass('active'); });
15)检查图像是否已经被完全加载进来
$('#theImage').attr('src', 'image.jpg').load(function () { alert('This Image Has Been Loaded'); });