jQuery链式操作如何实现以及为什么要用链式操作
链式操作就是分步骤地对jQuery对象实现各种操作,举个栗子:
$("#Test").css('color','red').show(200).removeClass('style');
上面的例子就是链式操作,在一行代码里,对id为Test的对象进行了三项操作:先设置其字体颜色为红色,再显示对象,最后移除对象的“style”这个样式。再炒个板栗:
$("#Test").addClass('style').find("div").eq(0).fadeOut(200);
上面的例子意为:先为id为Test的对象添加"style"这个样式,再找寻其下的第一个div标签,并使其淡出。
通过上面的两个例子不难看出链式操作就是围绕一个jQuery对象进行的,很简单吧?
为什么要用链式操作呢?原因有两个:
代码更精简。链式操作能大大精简代码量,多项操作一行代码一气呵成,搞定;
优化性能。使用链式操作,所有操作代码共享一个jQuery对象,省去了逐步查询DOM元素的性能损耗。
2015-01-31 · 知道合伙人互联网行家
链式操作就是分步骤地对jQuery对象实现各种操作,举个栗子:
1$("#Test").css('color','red').show(200).removeClass('style');上面的例子就是链式操作,在一行代码里,对id为Test的对象进行了三项操作:先设置其字体颜色为红色,再显示对象,最后移除对象的“style”这个样式。再炒个板栗:
上面的例子意为:先为id为Test的对象添加"style"这个样式,再找寻其下的第一个div标签,并使其淡出。
通过上面的两个例子不难看出链式操作就是围绕一个jQuery对象进行的,很简单吧?
为什么要用链式操作呢?原因有两个:
代码更精简。链式操作能大大精简代码量,多项操作一行代码一气呵成,搞定;
优化性能。使用链式操作,所有操作代码共享一个jQuery对象,省去了逐步查询DOM元素的性能损耗。
$("#Test").css('color','red').show(200).removeClass('style');
上面的例子就是链式操作,在一行代码里,对id为Test的对象进行了三项操作:先设置其字体颜色为红色,再显示对象,最后移除对象的“style”这个样式。再炒个板栗:
$("#Test").addClass('style').find("div").eq(0).fadeOut(200);
上面的例子意为:先为id为Test的对象添加"style"这个样式,再找寻其下的第一个div标签,并使其淡出。