如何将 querySelectorAll 节点的文本转换为 JSON 或 CSV

Question

我在 querySelectorAll 中获取 orderID 和 Name 的两个节点列表。

这是我的选择器 javascript 代码

document.querySelectorAll("orderid").forEach(a => alert(a.textContent));

document.querySelectorAll("name").forEach(a => alert(a.textContent));

我收到每个订单 ID 和名称的警报，仅用于测试目的。我想要的是为 orderid 和 name 的文本内容创建一个 Json 或 csv，稍后我将使用它在 Mysql 数据库中发送。

现在我想要 json 像这样的东西

{

"1":[ "orderid", "name" ],

"2":[ "orderid", "name" ]

}

或者

{

"orderid":[ "name" ],

"orderid":[ "name" ]

}

或者任何其他适合稍后通过 PHP 上传到 MySQL 的文件或 csv。

Answer 1

querySelectorAll如果您使用父 div 包装每个 orderId 和 name 元素，并且您是父 div，则看起来会更清晰。我认为不可能将键和值同时作为 JSON 格式的变量。这是我要做的（假设您的 orderId 和名称的长度相同）：const orderIds = document.querySelectorAll(".orderid")const names = document.querySelectorAll(".name")let records = []for(let i=0; i < orderIds.length; i++){&nbsp; const record = {&nbsp; &nbsp; &nbsp;orderId: orderIds[i].textContent,&nbsp; &nbsp; &nbsp;name: names[i].textContent&nbsp; }&nbsp; records.push(record)}然后您发送records到后端并从中提取数据。

Answer 2

我希望这能帮到您：let results = {orders:{},names:{}}let ordersElements = document.querySelectorAll(".orderId");let namesElements = document.querySelectorAll(".name")ordersElements.forEach((element,idx) => results["orders"][idx] = element.innerHTML)namesElements.forEach((element,idx) => results["names"][idx] = element.innerHTML)console.log(results)<div class="orderId">1</div><div class="orderId">2</div><div class="orderId">3</div><div class="orderId">4</div><div class="orderId">5</div><div class="name">first</div><div class="name">second</div><div class="name">third</div><div class="name">fourth</div><div class="name">last</div>