javascript - 使用 JavaScript 比较两个 json 文件 ID 值作为比较因素并显示相应的匹配项

Question

以下是json文件

1.question.json

[{
"Question":"Name any 5 flowers",
"id":["158_-121634659","158_-195702286","158_86710893","158_18978332","158_-58432062"]
}]

2.answer.json

[{
    "Group": "Beautiful",
    "id": "158_-121634659",
    "SubField": "Cloud Pricing and ROI Calculators",
    "Module": "Flowers",
}, {
    "Group": "colourful",
    "Field": "Related Links",
    "id": "158_-195702286",
    "SubField": "Guidance Toold to Determine which Subscription to include in Solution",
    "Module": "Flowers",
}, {
    "Group": "attractive",
    "Field": "Related Links",
    "id": "158_86710893",
    "SubField": "Customizations & Integrations",
    "Module": "Flowers",
}, {
    "Group": "Sweetsmelling",
    "Field": "Related Links",
    "id": "158_18978332",
    "SubField": "Market Price Guidance",
    "Module": "Flowers",
}, {
    "Group": "Large",
    "Field": "Cost Guidance",
    "id": "158_-58432062",
    "SubField": "",
    "Module": "Flowers",

}]

我需要将 ID 数组的每个元素与另一个文件中的每个 json 对象(id)进行比较，并显示与 ID 相关的相应内容(如果匹配)。

   function jsonLoadFile() {
    var input, file, fr;
    if (typeof window.FileReader !== 'function') {
        alert("The file API is not supported in this browser");
        return;
    }
    input = document.getElementById('fileinput');
    if (!input) {
        alert("couldn't find the fileinput element");
    }
    else if (!input.files) {
        alert("This browser doesn't seem to support the `files` property of file inputs.");
    }
    else if (!input.files[0]) {
        alert("Please select a file before clicking 'Load'");
    }
    else {
        file = input.files[0];
        fr = new FileReader();
        fr.onload = receivedText;
        fr.readAsText(file);
    }

   function receivedText(e) {
          lines = e.target.result;
          var newArr = JSON.parse(lines);
          for(i=0; i<newArr.length;i++){
          var span = document.createElement("span");
          var data= "<b>"+newArr[i].Question+"</b>";
          document.getElementById('myContent').innerHTML= myContent.innerHTML+ data;
                  }

}
}
 function jsonLoad() {
    var output,files, f;
    if (typeof window.FileReader !== 'function') {
        alert("The file API is not supported in this browser");
        return;
    }
    output = document.getElementById('fileoutput');
    if (!output) {
        alert("couldn't find the fileinput element");
    }
    else if (!output.files) {
        alert("This browser doesn't seem to support the `files` property of file inputs.");
    }
    else if (!output.files[0]) {
        alert("Please select a file before clicking 'Load'");
    }
    else {
        files = output.files[0];
        f = new FileReader();
        f.onload = receivetext;
        f.readAsText(files);
    }

   function receivetext(e){
   content=e.target.result;
   var Arr=JSON.parse(content);
   for(j=0;j<Arr.length;j++){
   var s=document.createElement("s");
   s.setAttribute("class", "");
   var sp=s.outerHTML;
   if(Arr[j].SubField != ""){
                    var d= sp+' '+"<b>"+Arr[j].SubField+"("+
                    Arr[j].Group+")"+"</b>"+"<br>"+"<br>"+' '+"ID : "+Arr[j].id+"<br>"+
                    Arr[j].Content+"<br>";
            }
            else {
                    var d= sp+' '+"<b>"+Arr[j].Field+"("+
                    Arr[j].Group+")"+"</b>"+"<br>"+"<br>"+' '+"ID : "+Arr[j].id+"<br>"+
                    Arr[j].Content+"<br>";
            }

            document.getElementById('Contents').innerHTML= Contents.innerHTML+ d;
            }

} }

上面的代码中我使用了两个FileReader()函数分别读取两个不同的JSON文件，根据条件显示Json的内容

哪里可以实现比较代码

Answer 1

语法可以是这样的:

var question = [{
"Question":"Name any 5 flowers",
"id":["158_-121634659","158_-195702286","158_86710893","158_18978332","158_-58432062"]
}];

var answer = [{
    "Group": "Beautiful",
    "id": "158_-121634659",
    "SubField": "Cloud Pricing and ROI Calculators",
    "Module": "Flowers",
}, {
    "Group": "colourful",
    "Field": "Related Links",
    "id": "158_-195702286",
    "SubField": "Guidance Toold to Determine which Subscription to include in Solution",
    "Module": "Flowers",
}, {
    "Group": "attractive",
    "Field": "Related Links",
    "id": "158_86710893",
    "SubField": "Customizations & Integrations",
    "Module": "Flowers",
}, {
    "Group": "Sweetsmelling",
    "Field": "Related Links",
    "id": "158_18978332",
    "SubField": "Market Price Guidance",
    "Module": "Flowers",
}, {
    "Group": "Large",
    "Field": "Cost Guidance",
    "id": "158_-58432062",
    "SubField": "",
    "Module": "Flowers",

}];

for(i = 0;i < answer.length; i++){
   for(j = 0;j < question.length; j++){
       if(question[j].id.indexOf(answer[i].id) > 0 ){
       console.log("Match");
   }
}

indexOf 将为您提供 id 是否存在。

以下部分进行比较:

for(i = 0;i < answer.length; i++){
   for(j = 0;j < question.length; j++){
       if(question[j].id.indexOf(answer[i].id) > 0 ){
       console.log("Match");
   }
}