javascript 创建包含数据的卡片而不是表格

am46iovg 于 2023-01-16 发布在 Java

关注(0)|答案(1)|浏览(116)

从一个json开始，我想得到一组卡片或div，里面有json数据，如下表所示。不使用React库或Angular框架的最佳解决方案是什么

var `dataSet = [`

`['Shou Itou', 'Regional Marketing', 'Tokyo', '8899', '2011/08/14', '$163,000'],`

`['Michelle House', 'Integration Specialist', 'Sydney', '2769', '2011/06/02', '$95,400'],`

`['Suki Burks', 'Developer', 'London', '6832', '2009/10/22', '$114,500'],`

`['Prescott Bartlett', 'Technical Author', 'London', '3606', '2011/05/07', '$145,000'],`

`['Gavin Cortez', 'Team Leader', 'San Francisco', '2860', '2008/10/26', '$235,500'],`

`['Martena Mccray', 'Post-Sales support', 'Edinburgh', '8240', '2011/03/09', '$324,050'],`

`['Unity Butler', 'Marketing Designer', 'San Francisco', '5384', '2009/12/09', '$85,675'],`

\];

$(document).ready(`function` `() {`

`$('#example').DataTable({`

`data: dataSet,`

`columns: [`

`{ title: 'Name'` `},`

`{ title: 'Position'` `},`

`{ title: 'Office'` `},`

`{ title: 'Extn.'` `},`

`{ title: 'Start date'` `},`

`{ title: 'Salary'` `},`

`],`

`});`

});

这就是我希望通过

中的数据实现的目标

JavaScript

来源：https://stackoverflow.com/questions/75123357/create-a-cards-with-data-instead-of-a-table

1条答案

按热度按时间

hgb9j2n61#

**这可能是一个解决方案。**我希望能帮助你。上面你是用jquery

function get() {
 var books = **YourQuery**.then(
    function success(result) {
        for (var i = 0; i < result.entities.length; i++) {
            console.log(result.entities[i].ava_name);
            var x = result.entities[i].ava_name;
            var div = document.createElement('div');

            div.id = i;
         
            div.style.backgroundColor = "red";
            div.style.padding = "50px 10px 20px 30px";
            div.style.width = "250px";
            div.style.height = "300px";
            div.style.margin = "50px 10px 20px 30px";
            div.style.textAlign = "center";
            div.innerHTML = x;
            div.className = 'border pad';
            div.style.display = 'inline-block';
            div.style.border = "30px inset #0000FF";
            document.body.appendChild(div);

        } debugger;

    },
    function (error) {
        console.log(error.message);

    }
);

}

赞(0）回复(0）举报 2023-01-16

我来回答

javascript 创建包含数据的卡片而不是表格

1条答案

相关问题

热门标签

最新问答