我有下面的 HTML 表，我想獲取標簽之間的數據，這些數據有時是單行，有時是多行。<table> <tbody> <tr> <th>Role</th> <th>Device Name</th> <th>IP Address </th> <th>MAC Address </th> <th>Registered </th> <th>Subscribers </th> <th>Events </th> </tr> <tr> <td> CM </td> <td> - </td> <td>192.168.7.110 </td> <td>506182488323 </td> <td>XYZ </td> <td> Shkdsd30ec1 </td> <td>Events </td> </tr> </tbody></table>我想使用此表生成 JSON，如下面的代碼使用 javascript{ "Role" : "CM", "Device Name" : "-", "IP Address" : "192.168.7.110", "MAC Address" : "506182488323", "Registered" : "XYZ", "Subscribers" : "Shkdsd30ec1", "Events" : "Events"}如果有更多帶有密鑰的標簽，則應該遞增，例如 Role->Role1->Role2 等。
2 回答
翻閱古今
TA貢獻1780條經驗 獲得超5個贊
假設您的 HTML 正文中只有此表...
let t = document.getElementsByTagName("table");
let trs = t[0].getElementsByTagName("tr");
let oKeys = [], oVals = [];
let ths = trs[0].getElementsByTagName("th");
let tds = trs[1].getElementsByTagName("td");
ths = Array.from(ths);
tds = Array.from(tds);
ths.map( item => {
oKeys.push(item.innerText);
return ;
});
tds.map( item => {
oVals.push(item.innerText);
return ;
});
console.log("O keys ", oKeys);
console.log("oVals ", oVals);
let newObj = {};
oKeys.map( (key, i) => {
let val = oVals[i];
Object.assign(newObj, {[key] : val })
});
console.log(newObj);
<table id="myTable">
<tbody>
<tr>
<th>Role</th>
<th>Device Name</th>
<th>IP Address </th>
<th>MAC Address </th>
<th>Registered </th>
<th>Subscribers </th>
<th>Events </th>
</tr>
<tr>
<td>
CM
</td>
<td>
-
</td>
<td>192.168.7.110 </td>
<td>506182488323 </td>
<td>XYZ
</td>
<td> Shkdsd30ec1
</td>
<td>Events
</td>
</tr>
</tbody>
</table>
newObj 保存您想要的數據。您可以在上述邏輯中添加更多內容。
慕仙森
TA貢獻1827條經驗 獲得超8個贊
使用 jQuery 進行 dom 選擇，這段 JS 代碼應該可以工作
var myRows = [];
var headersText = [];
var $headers = $("th");
// Loop through grabbing everything
var $rows = $("tbody tr").each(function(index) {
? $cells = $(this).find("td");
? myRows[index] = {};
? $cells.each(function(cellIndex) {
? ? // Set the header text
? ? if(headersText[cellIndex] === undefined) {
? ? ? headersText[cellIndex] = $($headers[cellIndex]).text();
? ? }
? ? // Update the row object with the header/cell combo
? ? myRows[index][headersText[cellIndex]] = $(this).text();
? });
});
// Let's put this in the object like you want and convert to JSON (Note: jQuery will also do this for you on the Ajax request)
var myObj = {
? ? "myrows": myRows
};
console.log(myRows);
- 2 回答
- 0 關注
- 178 瀏覽
添加回答
舉報
0/150
提交
取消