Question

我正在寻找一种方法来比较屏幕上的2个json记录。我想要的方式是，我想并排显示这两条记录并标记匹配或不匹配的属性。

是否有一个库已经完成，如果没有，我该怎么办？

修改

我的目标是识别相同/不同的属性＆amp;向不同风格的用户展示，而不是将对象作为一个整体进行比较。

Answer 1

有人为此制作了一个jQuery插件--jQuery.PrettyTextDiff。

https://github.com/arnab/jQuery.PrettyTextDiff

$("input[type=button]").click(function () {
    $("#wrapper tr").prettyTextDiff({
        cleanup: $("#cleanup").is(":checked")
    });
});

JSFiddle

Answer 2

这是一个快速JavaScript函数，可帮助您比较JSON字符串。

首先，它检查它们是否具有相同数量的属性，然后比较它们具有相同属性（按名称），然后比较这些值。

您可能需要调整值比较（以允许undefined或null）。

希望它对你来说是一个好的开始。

<script type="text/javascript">
    var so = {}; // stackoverflow, of course.
    so.compare = function (left, right) {

        // parse JSON to JavaScript objects
        var leftObj = JSON.parse(left);
        var rightObj = JSON.parse(right);

        // add object properties to separate arrays. 
        var leftProps = [];
        var rightProps = [];
        for(var p in leftObj) { leftProps.push(p); }
        for(var p in rightObj) { rightProps.push(p); }

        // do they have the same number of properties
        if (leftProps.length != rightProps.length) return false;

        // is every right property found on the left
        for (var r = 0; r < rightProps.length; r++) {
            var prop = rightProps[r];
            if (leftProps.indexOf(prop) < 0) {
                return false;
            }
        }
        // is every left property found on the right
        for (var r = 0; r < leftProps.length; r++) {
            var prop = leftProps[r];
            if (rightProps.indexOf(prop) < 0) {
                return false;
            }
        }

        // do the values match?
        for (var q = 0; q < leftProps.length; q++) {
            var propname = leftProps[q];
            var leftVal = leftObj[propname];
            var rightVal = rightObj[propname];
            if (leftVal != rightVal) {
                return false;
            }
        }

        return true;
    }
</script>

用javascript比较屏幕上的2条记录

2 个答案: