将逗号分隔的数据类型转换为json有效源

Question

我有喜欢的数据属性：

data-columns = "title,dateaquired,genre,num_discs, etc etc - it can be any number of fields 

试图将json转换为此

[

            { data: "title" },

            { data: "dateacquired" },

            { data: "genre" },

            { data: "num_discs" },

            { data: "esrb_rating" },

            { data: "publisher" },

            { data: "platform" },

            { data: "seriesname" },

            { data: "delete" }

        ]

并且还尝试这样做：在上面的数据中是static值，在底部，尝试使用column它。

data: {

                title: $("#title").val(),

                dateacquired: $("#dateacquired").val(),

                genre: $("#genre").val(),

                num_discs: $("#num_discs").val(),

                esrb_rating: $("#esrb_rating").val(),

                publisher: $("#publisher").val(),

                platform: $("#platform").val(),

                seriesname: $("#seriesname").val()

            }

Answer 1

我假设你想得到这个输出data: {            title: $("#title").val(),            dateacquired: $("#dateacquired").val(),            genre: $("#genre").val(),            num_discs: $("#num_discs").val(),            esrb_rating: $("#esrb_rating").val(),            publisher: $("#publisher").val(),            platform: $("#platform").val(),            seriesname: $("#seriesname").val()        }从数据列。假设您有数据列并分配了它let datacolumns=$(#myid).attr('data-columns')检查以下代码片段let datacolumns="title,dateacquired,genre,num_discs,esrb_rating, publisher,platform,seriesname,delete"; let data={}; let arr=[]; datacolumns.split(",").forEach((element)=>{    //using trim in case there is space    arr.push({    data:element.trim()    })    data[element]=`$(#).val()`;//for displaying purpose   //uncomment below line to work   //data[element]=$(`#${element.trim(0}`).val()` }) console.log(data); console.log(arr);.as-console-wrapper { max-height: 100% !important; top: 0; }

Answer 2

假设您在数据属性中有以下值。首先，您必须通过 id 获取它，然后添加一个 split 方法以用逗号拆分字符串。然后您可以使用它们来创建对象格式。<p&nbsp; id="myid" data-columns = "title,dateaquired,genre,num_discs, etc etc - it can be any number of fields"></p>let commaSplited = $(#myid).attr('data-columns').split(',');现在您可以通过这种方式创建所需结构的对象。索引将取决于逗号分隔值的位置。let obj = [&nbsp; &nbsp; &nbsp; data: {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;title: commaSplited [0],&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;dateacquired: commaSplited[1] ,&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;genre: commaSplited[2],&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;num_discs: commaSplited[3],&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;esrb_rating: commaSplited[4],&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;publisher: commaSplited[5],&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;platform: commaSplited[6],&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;seriesname: commaSplited[7]&nbsp; &nbsp; &nbsp; }];

Answer 3

使用 Data-* 属性在属性字符串上拆分遍历属性并查找 HTML 元素的值为对象赋值在这种情况下，步骤 2 和 3 通过以下reduce函数处理：let data = target.dataset.columns.split(',').reduce((obj, key)=>{&nbsp; let el = document.querySelector('#'+key)&nbsp; obj.data[key] = el && el.value&nbsp; || ''&nbsp; return obj;}, { data: {} });console.log(data)<div id="target" data-columns="title,dateacquired,genre,num_discs"></div><input type="hidden" id="title" value="Top Gun" /><input type="hidden" id="dateacquired" value="1989" /><input type="hidden" id="genre" value="Homoerotic Dramatic Comedy" /><input type="hidden" id="num_discs" value="1" />或者let arr = target.dataset.columns.split(',').map(key=>({ data: key }));console.log(arr)<div id="target" data-columns="title,dateacquired,genre,num_discs"></div>