有没有办法比较jQuery对象而忽略HTML属性的ORDER？

Question

使用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元素.)

Answer 1

如果我们需要忽略属性的顺序,我们可以使用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/

UPDATE

Joe在注释中链接的一个更简单的解决方案,它应该在IE9 +中工作并处理子元素,它使用原生的"isEqualNode"函数.请在此处查看解决方案:https://stackoverflow.com/a/19342581/1785003