如何使用javascript从字符串传递到对象？

Question

我有以下代码：

    const burger = `<div class="card" data-id="42" data-price="15" data-category="popular">`

我需要以下对象：

    const obj = { id: 42, price: 15, category: 'popular' }

使用此功能：

let regex = /(?<name>\w+)="(?<value>\w+)"/g;
let results = burger.matchAll(regex);

for(let result of results) {
  let {name, value} = result.groups;
  let valores = `${name}: ${value}`;
  console.log(valores)
}

我得到以下信息，但这不是我想要的

    > "class: card"
    > "id: 42"
    > "price: 15"
    > "category: popular"

Answer 1

您可以使用DOMParser 来解析 HTML，获取第一个子元素并遍历所有属性。

要将数字和布尔字符串转换为相应的类型，我们可以使用isNaN 和简单的字符串比较。

parseInt() 用于将字符串转换为数字，JSON.parse() 用于将字符串转换为布尔值。

const burger = `<div class="card" data-id="42" data-price="15" is-author-spectric="true" data-category="popular"><div class="card-category">Popular</div><div class="card-description"><h2>The best burger in town (15€)</h2></div></div>`;

const parser = new DOMParser().parseFromString(burger, "text/html");
const elem = parser.body.firstChild;
var json = {};
for (var i = 0; i < elem.attributes.length; i++) {
    var attrib = elem.attributes[i];
    json[attrib.name] = !isNaN(attrib.value) ? parseInt(attrib.value) : attrib.value == "true" || attrib.value == "false" ? JSON.parse(attrib.value) : attrib.value;
}

console.log(json);