首頁(yè) 猿問如何使用 JS 對(duì)比數(shù)組對(duì)象并用...

如何使用 JS 對(duì)比數(shù)組對(duì)象并用 Table 繪制結(jié)果？

JavaScript

至尊寶的傳說 2019-01-04 16:31:40

問題描述給出原始數(shù)據(jù)：var data = [ { title: "張三", sex: "男", age: "22", address: "吉祥村" }, { title: "李四", sex: "男", age: "24", address: "魚化寨" } ];如上，如何對(duì)比數(shù)組中的兩個(gè)或者多個(gè)對(duì)象，并用 Table 繪制期待結(jié)果如下：title張三李四sex男男age2224address吉祥村魚化寨

查看完整描述

1 回答

互換的青春

TA貢獻(xiàn)1797條經(jīng)驗(yàn) 獲得超6個(gè)贊

<!DOCTYPE html><html>
    <head>
        <meta charset="UTF-8">
        <title></title>
        <style>

        </style>
    </head>
    <body>
        <table border="1">
            <tbody>
                
            </tbody>
        </table>
    </body>
    <script>
        var data = [
            {                title: "張三",                sex: "男",                age: "22",                address: "吉祥村"
            },
            {                title: "李四",                sex: "男",                age: "24",                address: "魚化寨"
            }
        ];        var arr = [];        for(var i in data[0]){
            arr.push([i])
        }        for(var i in data){            for(var j in data[i]){                for(var k in arr){                    if(arr[k][0]===j){
                        arr[k].push(data[i][j]);
                    }
                }
            }
        }        var tbody = document.getElementsByTagName('tbody')[0];        for(var i in arr){            var tr = document.createElement("tr");            for(var j in arr[i]){
                tr.innerHTML += '<td>'+arr[i][j]+'</td>';
            }
            tbody.appendChild(tr);
        }        
    </script></html>

反對(duì) 回復(fù) 2019-01-04