您的浏览器过于古老 & 陈旧。为了更好的访问体验, 请 升级你的浏览器
Ready 发布于2014年09月25日 09:14

原创 jQuery.unique() 函数详解

3682 次浏览 读完需要≈ 6 分钟

内容目录

jQuery.unique()函数用于根据元素在文档中出现的先后顺序对DOM元素数组进行排序,并移除重复的元素

注意:该函数仅作用于DOM元素数组,而不是数字、字符串或其他类型。此外,这里的重复指的是两个元素实际上是同一个元素(通过全等"==="来判断),而不是指两个属性相同的元素。

警告:通过实际测试发现,该函数并不能按照预期返回正确的结果。在不同的浏览器中、在不同版本的jQuery中,其返回结果可能不一致(请参考下面的演示代码)。

该函数属于全局jQuery对象。

语法

jQuery 1.1.3 新增静态函数

jQuery.unique( array )

参数

参数 描述
array Array类型指定的DOM元素数组。

对数组中的DOM元素按照文档顺序进行排序,是从jQuery 1.4开始的。

返回值

jQuery.unique()函数的返回值为Array类型,返回排序、去重后的DOM元素数组。

示例&说明

jQuery.unique()函数的排序和去除,依赖于浏览器自身的相关API实现(如果没有相关实现,则使用jQuery自己的实现),由于算法以及bug等因素,该函数的返回结果可能不符合期望。

请先参考以下HTML示例代码:

<p id="n1" class="test">段落1</p>
<p id="n2" class="test">段落2</p>
<p id="n3">段落3
	<span id="n4" class="test">文本1</span>
</p>
<div id="n5" class="test">文本2</div>
<p id="n6">段落4</p>

以下是与jQuery.unique()函数相关的jQuery示例代码,以演示jQuery.unique()函数的具体用法:

// 打印DOM元素数组中所有元素的id
function printDoms( doms ){
	var ids = [];
	for(var i = 0; i < doms.length; i++ ){
		ids[i] = doms[i].id;
	}
	document.body.innerHTML += "<br/>" + ids.join(", ");
}

// 匹配n1、n2、n3、n6 四个元素
var pArray = $("p").get();
// 匹配n1、n2、n4、n5 四个元素
var testArray = $(".test").get();

// 联接两个数组
var total = pArray.concat( testArray );
printDoms( total ); // n1, n2, n3, n6, n1, n2, n4, n5

// 使用$.unique()进行排序、去重
var result = $.unique( total );
printDoms( result ); // n1, n2, n3, n6, n4, n5 (在Chrome浏览器中)
// 在IE或火狐上,其结果仍然为 n1, n2, n3, n6, n1, n2, n4, n5

/* 以上输出基于jQuery 1.11.1,在不同版本的jQuery中,其结果可能并不一致 */

运行代码

  • CodePlayer技术交流群1
  • CodePlayer技术交流群2

0 条评论

撰写评论

打开导航菜单