有没有一种方法来比较jQuery对象,而忽略HTML属性'秩序

Is there a way to compare jQuery objects while ignoring the HTML attributes' ORDER?

本文关键字:HTML 属性 秩序 对象 一种 方法 jQuery 比较 有没有      更新时间:2023-09-26

使用jQuery的"is"函数运行以下比较将返回false,因为DOM元素并不完全相同,尽管它们在视觉上和功能上是相同的:

var $a = $('<div id="test" href="http://www.google.com"></div>');
var $b = $('<div href="http://www.google.com" id="test"></div>');
$a.is($b);//FALSE

直接比较DOM对象也会返回false。

参见运行示例:http://jsfiddle.net/6zqwn/5/

那么,有没有一种方法可以避免在比较时考虑属性的顺序?

为什么我问这个问题:我在跨浏览器的单元测试中使用这些比较,不同的浏览器改变属性的顺序,同时仍然在功能上创建相同的DOM元素。

如果我们需要忽略属性' order,我们可以使用jQuery选择器作为"is"函数的参数,然后分别比较元素的内部HTML。

使用与问题相同的例子:

var $a = $('<div id="test" href="http://www.google.com"></div>');
var $b = $('<div href="http://www.google.com" id="test"></div>');
var selector = 'div#test[href="http://www.google.com"]';
($a.is(selector) == $b.is(selector)) && ($a.html() == $b.html());//TRUE

参见运行示例:http://jsfiddle.net/GuQ53/4/


Joe在评论中提到的一个更简单的解决方案是使用本地的"isEqualNode"函数,它应该在IE9+中工作,也可以处理子元素。解决方案:https://stackoverflow.com/a/19342581/1785003