Question

$("<div>", {class: "wrapper"}).append(
        $("<div>", {class: "LeftSection"}).append(
            $("<div>", {class: "MyMainSavings"}).append(
				$("<div>", {class: "MyMainSavingsTop"}).append($("<table>",{class: "MyMainSavingsTop"})).append($("<table>")),
				$("<div>", {class: "MyMainSavingsBottom"}).append($("<table>",{class: "tablebottom"}))
			),
			$("<div>", {class: "MyEverydayExpenses"}).append(
				$("<div>", {class: "MyEverydayExpensesTop"}).append($("<table>",{class: "MyEverydayExpensesTop"})),
				$("<div>", {class: "MyEverydayExpensesBottom"}).append($("<table>",{class: "tablebottom"}))
			),
			$("<div>", {class: "MyDeposit"}).append(
				$("<div>", {class: "MyDepositTop"}).append($("<table>",{class: "MyDepositTop"})),
				$("<div>", {class: "MyDepositBottom"}).append($("<table>",{class: "tablebottom"}))
			),
			$("<div>", {class: "FavDeposit"}).append(
				$("<div>", {class: "FavDepositTop"}).append($("<table>",{class: "FavDepositTop"})),
				$("<div>", {class: "FavDepositBottom"}).append($("<table>",{class: "tablebottom"}))
			)
        ), 
        $("<div>", {class: "RightSection"}).append(
			$("<div>", {class: "HomeLoan"}).append(
				$("<div>", {class: "HomeLoanTop"}).append($("<table>",{class: "HomeLoanTop"})),
				$("<div>", {class: "HomeLoanBottom"}).append($("<table>",{class: "tablebottom"}))
			),
			$("<div>", {class: "Ruby"}).append(
				$("<div>", {class: "RubyTop"}).append($("<table>",{class: "RubyTop"})),
				$("<div>", {class: "RubyBottom"}).append($("<table>",{class: "tablebottom"}))
			),
			$("<div>", {class: "MyOverdraft"}).append(
				$("<div>", {class: "MyOverdraftTop"}).append($("<table>",{class: "MyOverdraftTop"})),
				$("<div>", {class: "MyOverdraftBottom"}).append($("<table>",{class: "tablebottom"}))
            )
    )).appendTo("body")

我试图遍历下面的complx json结构的每个内部元素。但是我使用的for和每个循环都不够好。我需要指出某个键，例如。 MyMainSavingsTop，并在jquery中获取该键的名称。

     var mainObject = {
     "Main": [{
      "I_Have": [{
      "typeofAcc": "casa",
      "key": "MyMainSavings",
      "MyMainSavings": {
        "MyMainSavingsTop": {
          "AccountName": "MyMainSavings",
          "AccountNumber": "x726",
          "Balance": "USD 5,600.00",
          "Rate": ""
        },
        "MyMainSavingsBottom": [{
          "Available": "Available",
          "Value": "$4329"
        }, {
          "Clear": "Clear",
          "Value": "$3456"
        }, {
          "Hold": "Hold",
          "Value": "$5000"
        }]
      }
        }, {
      "key": "MyEverydayExpenses",
      "MyEverydayExpenses": {
        "MyEverydayExpensesTop": {
          "AccountName": "MyMainSavings",
          "AccountNumber": "x726",
          "Balance": "USD 600.00",
          "Rate": ""
        },
        "MyEverydayExpensesBottom": [{
          "Available": "Available",
          "Value": "$4329"
        }, {
          "Clear": "Clear",
          "Value": "$3456"
        }, {
          "Hold": "Hold",
          "Value": "$7300"
        }]
      }
        }, {
      "key": "FavDeposit",
      "FavDeposit": {
        "FavDepositTop": {
          "AccountName": "MyMainSavings",
          "AccountNumber": "x726",
          "Balance": "USD 5,000.00",
          "Rate": "@4.5%"
        },
        "FavDepositBottom": [{
          "MaturityValue": "Maturity Value",
          "Value": "$4009"
        }, {
          "Term": "Term",
          "Value": "$1156"
        }, {
          "MaturesOn": "Matures On",
          "Value": "$5000"
        }]
      }
       }, {
      "key": "MyDeposit",
      "MyDeposit": {
        "MyDepositTop": {
          "AccountName": "MyMainSavings",
          "AccountNumber": "x726",
          "Balance": "USD 8,600.00",
          "Rate": "@4.5%"
        },
        "MyDepositBottom": [{
          "MaturityValue": "Maturity Value",
          "Value": "$4329"
        }, {
          "Term": "Term",
          "Value": "$3456"
        }, {
          "MaturesOn": "Matures On",
          "Value": "$5000"
        }]
      }
    }]
     }, {
    "I_Owe": [

      {
        "key": "HomeLoan",
        "HomeLoan": {
          "HomeLoanTop": {
            "AccountName": "MyMainSavings",
            "AccountNumber": "x726",
            "Balance": "USD 5,600.00",
            "Rate": "@4.5% floating"
          },
          "HomeLoanBottom": [{
            "Installment": "Installment",
            "Value": "$4329"
          }, {
            "Disbursed": "Disbursed",
            "Value": "$3456"
          }, {
            "CurrentDues": "Current Dues",
            "Value": "$5000"
          }]
        }
      }, {
        "key": "Ruby",
        "Ruby": {
          "RubyTop": {
            "AccountName": "MyMainSavings",
            "AccountNumber": "x726",
            "Balance": "USD 600.00",
            "Rate": ""
          },
          "RubyBottom": [{
            "$6500 Dues": "$6500 Dues",
            "Value": "$4329"
          }, {
            "Minimum Due": "Minimum Due",
            "Value": "$3456"
          }, {
            "Unbilled": "Unbilled",
            "Value": "$7300"
          }]
        }
      }, {
        "key": "MyOverdraft",
        "MyOverdraft": {
          "MyOverdraftTop": {
            "AccountName": "MyMainSavings",
            "AccountNumber": "x726",
            "Balance": "USD 5,000.00",
            "Rate": ""
          },
          "MyOverdraftBottom": [{
            "Available": "Available",
            "Value": "$4009"
          }, {
            "Unclear": "Unclear",
            "Value": "$1156"
          }, {
            "Sanc_Limit": "Sanc. Limit",
            "Value": "$5000"
          }]
        }
      }
      ]
     }]
     }

我尝试过以下方法：

$.each(mainObject, function(key, v) {
      if (mainObject.hasOwnProperty(v)) {
        var val = mainObject[v];
        var table123 = $('<table></table>') //.addClass('MyMainSavingsTop');
        for (i = 0; i < this.key.length; i++) {
          var row = $('<tr></tr>').text(this.v);
          table123.append(row);
        }
      }

Answer 1

修改根据新信息，我创建了一些内容，用于根据给定的结构和所描述的内容将单元格添加到表中。可以做更多的事情，但没有更多关于你需要什么有点困难的信息。检查这个jsfiddle我的代码。

jsfiddle

注意要在链接中使用jsfiddle，请在追加容器后删除任何内容。 jsFiddle中的JS会根据需要附加所有内容。

实施例： ["Michael", "Michael", "Angelo"]

以下仅供参考，可能对某人有用

递归方法可能会很好

$("<div>", {class: "LeftSection"}).append( $("<div>", {class: "MyMainSavings"}), $("<div>", {class: "MyEverydayExpenses"}) )

上面的代码获取一个对象（或数组）并解析它以找到指定了Key的对象。此代码假设对象中只存在该名称的1个键。要使用此功能，请运行以下命令：

function getSubItems(obj, key, wrap) { var result; var arr; switch (obj.constructor.name) { case "Object": arr = Object.keys(obj).map(function(k) { if (k == key) return { __wrapper: obj[k] }; return getSubItems(obj[k], key, true); }); break; case "Array": arr = obj.map(function(i) { return getSubItems(i, key, true) }) break; } if (arr) if (arr.length > 0) result = arr .filter(function(item) { if (item) if (item.constructor) return item.constructor.name === "Object"; })[0] if (result) if (result.__wrapper && wrap === undefined) return result.__wrapper return result; }

复杂json

1 个答案: