Javascript 将JSON数据拆分为2组

我有一个json数据，我想分成两组数据数组 一个json数据将保存“构造”数据值下的所有值 第二个json数据将保存产品和系统的剩余ARAY和值

如何将JSON一分为二

{
    "html": [{
        "type": "fieldset",
        "caption": "Construct",
        "html": [{
            "title": "tooltip data for rk",
            "name": "rk_",
            "value": "24",
            "caption": "DNS Servers (a list of IP addresses separated by comas)",
            "type": "textarea"
        }, {
            "title": "tooltip data for rk_ntpservers",
            "name": "rk_ntpservers",
            "value": "111.11.11.11",
            "caption": " separated by comas",
            "type": "textarea"
        }, {
            "title": "tooltip data for ff_eth0_ff",
            "name": "ff_eth0_ff",
            "value": "18",
            "caption": "Public  Address (0.0.0.0 to disable)",
            "type": "text"
        }, {
            "title": "tooltip data for ff_eth0_netmask",
            "name": "ff_eth0_netmask",
            "value": "2.2.2.0",
            "caption": "Public rk Netmask",
            "type": "text"
        }, {
            "title": "tooltip data for ff_eth1_ff",
            "name": "ff_eth1_ff",
            "value": "0.0.0.0",
            "caption": "MG Device rk (0.0.0.0 to disable)",
            "type": "text"
        }, {
            "title": "tooltip data for ff_eth1_netmask",
            "name": "ff_eth1_netmask",
            "value": "2.2.2.0",
            "caption": "MG Device rk Netmask",
            "type": "text"
        }, {
            "title": "tooltip data for ff",
            "name": "ff_gateway",
            "value": "1",
            "caption": "Gateway",
            "type": "text"
        }]
    }, {
        "type": "fieldset",
        "caption": "Product",
        "html": [{
            "title": "tooltip data for product_ident",
            "name": "product_ident",
            "value": "78",
            "caption": "Product Name",
            "type": "text",
            "disabled": "disabled"
        }, {
            "title": "tooltip data for product_svnversion",
            "name": "product_svnversion",
            "value": "7916",
            "caption": "Revision",
            "type": "text",
            "disabled": "disabled"
        }]
    }, {
        "type": "fieldset",
        "caption": "System ",
        "html": [{
            "title": "tooltip data for system_license",
            "name": "system_license",
            "value": "HH",
            "caption": "License",
            "type": "text"
        }, {
            "title": "tooltip data for system_variant",
            "name": "system_variant",
            "value": "normal",
            "caption": "Variant",
            "type": "text"
        }]
    }, {
        "type": "fieldset",
        "class": "btn-fieldset",
        "caption": "",
        "html": [{
            "type": "submit",
            "id": "submitbtn",
            "class": "btn btn-primary",
            "value": "Save"
        }]
    }]
}

我的更新代码现在是wokring

我似乎无法输出构造组数据：（.但我可以将resofJSONdata很好地输出

$(document).ready(function () // don't do anything until the document is loaded.
{

    var baseUrl = "configuration.json";

    $.getJSON(baseUrl, function (data) // call getJSON providing the complete url with search term and a JSONP callback
    {
        // console.log(data.html.splice(2,3));
        // console.log("data " +data);

        console.log(data.html.splice(3, 0)); // remove and log the empty fieldset
        var constructgrp = data.html.shift(); // remove the first item (caption: "Construct")

        var restofJSONdata = data.html;
        alert(constructgrp);

        $("#demo-3-form").empty(); // clear out any previous results.
        if (data.html.length < 1) $('#demo-3-forms').html("No results. Nada. Nuttin. Zippo.");

        //$("#demo-3-form").empty(); // clear out any previous results.
        // if (data.html.length < 1) $('#demo-3-forms').html("No results. Nada. Nuttin. Zippo.");
        //   $.each(this.constructgrp, function () // iterate over the results, constructing the HTML for the display.
        // {

        var html = constructgrp.type + ' :';
        html += '<b>' + constructgrp.caption + '</b><br>';

        html += ' <br>';
        $.each(constructgrp.html, function () {
            //  alert(this.name);
            html += 'Title :' + this.title + '<br>';
            html += 'Name :' + this.name + '<br>';
            html += 'Value :' + this.value + '<br> ';
            html += 'Caption :' + this.caption + '<br><br> ';
            // html += this.type +'<br><br> ';
        });
        $('#demo-3-form').hide().append(html).fadeIn(800); // fade in the results over 2 seconds.
        // });



        $.each(restofJSONdata, function () // iterate over the results, constructing the HTML for the display.
        {

            var html = this.type + ' :';
            html += '<b>' + this.caption + '</b><br>';

            html += ' <br>';
            $.each(this.html, function () {
                //  alert(this.name);
                html += 'Title :' + this.title + '<br>';
                html += 'Name :' + this.name + '<br>';
                html += 'Value :' + this.value + '<br> ';
                html += 'Caption :' + this.caption + '<br><br> ';
                // html += this.type +'<br><br> ';
            });
            $('#demo-3-form').hide().append(html).fadeIn(800); // fade in the results over 2 seconds.
        });


    });
    //});
});

$（document）.ready（函数（）//在加载文档之前不要执行任何操作。
{
var baseUrl=“configuration.json”；
$.getJSON（baseUrl，函数（数据）//调用getJSON，提供完整的url和搜索词以及JSONP回调
{
//log（data.html.splice（2,3））；
//控制台日志（“数据”+数据）；
console.log（data.html.splice（3,0））；//删除并记录空字段集
var constructgrp=data.html.shift（）；//删除第一项（标题：“构造”）
var restofJSONdata=data.html；
警报（GRP）；
$（“#demo-3-form”）.empty（）；//清除以前的任何结果。
if（data.html.length<1）$（'demo-3-forms'）.html（“No results.Nada.Nuttin.Zippo.”）；
//$（“#demo-3-form”）.empty（）；//清除以前的任何结果。
//if（data.html.length<1）$（'demo-3-forms'）.html（“No results.Nada.Nuttin.Zippo.”）；
//$.each（this.constructgrp，function（）//迭代结果，为显示构建HTML。
// {
var html=constructgrp.type+'：'；
html+=''+constructgrp.caption+'
'；
html+='
'；
$.each（constructgrp.html，函数（）{
//警报（此名称）；
html+='Title:'+this.Title+'
'；
html+='Name:'+this.Name+'
'；
html+='Value:'+this.Value+'
'；
html+='Caption:'+this.Caption+'

'；
//html+=this.type+'

'；
});
$（'#demo-3-form'）.hide（）.append（html）.fadeIn（800）；//在2秒内淡入结果。
// });
$.each（restofJSONdata，function（）//迭代结果，构建用于显示的HTML。
{
var html=this.type+'：'；
html+=''+this.caption+'
'；
html+='
'；
$.each（this.html，函数（）{
//警报（此名称）；
html+='Title:'+this.Title+'
'；
html+='Name:'+this.Name+'
'；
html+='Value:'+this.Value+'
'；
html+='Caption:'+this.Caption+'

'；
//html+=this.type+'

'；
});
$（'#demo-3-form'）.hide（）.append（html）.fadeIn（800）；//在2秒内淡入结果。
});
});
//});
});

html

你似乎把它弄糊涂了。第一个提取数组项，第二个删除数组项。也许这就是你想要的：

console.log(data.html.splice(3)); // remove and log the 4th item and everything after 
var constructgrp = data.html.shift(); // remove the first item (caption: "Construct")
var restofJSONdata = data.html; // take what is left over

尝试使用JavaScript的：

var splitData=data.html.reduce（函数（memo，x）{
//选择“构造”或“其他”数据的数组。
var arr=memo[（x.caption=='Construct'？'Construct'：'Other'）；
[].push.apply（arr，x.html）；//将“html”数组中的所有项推送到它。
返回备忘录；
}，{Construct:[]，Other:[]}）；
splitData.Construct；//=>[{值：24，…}，…]
拆分数据。其他；//=>[{值：78，…}，…]

---

请注意，如果您只需要“产品”和“系统”下的项目（而不是另一个，空的项目），那么在选择要在其上推送数据的目标阵列时，您需要添加额外的检查。

因为您只有3个元素，这似乎非常简单：

data.html[0] is your Construct
data.html[1] is your Product
data.html[2] is your System

例如，一个包含产品和系统的阵列可以是：

[data.html[1],data.html[2]]

[更新]如果您有3个以上的元素，只需隔离第一个元素：

var firstElement=data.html.shift();

---

shift（）将从数组中删除第一个元素并返回它。

如何“拆分”它？

shift

返回第一个元素，而不是数组。谢谢。我现在可以输出剩余的JSONDATA，但我还想输出constructgrp。restofJSONdata。它似乎没有输出任何内容。只需删除

每个

，并将

此

替换为

constructgrp

。该值不是数组，因此不需要循环。或者您可以使用

var constructgrp=data.html.splice（0，1）

来获得一个数组。嘿，谢谢，我更新了我的代码，现在可以使用了。。看一看。谢谢，我有可能给出3个或更多的元素