javascript - 在 Vuejs 中读取 HTML 响应并将其显示在对话框中

标签 javascript vue.js vuejs2 vuetify.js

我从服务器收到 HTML 格式的 REST 请求响应。我已将其存储在 data:[] 中,当我在控制台上打印它时,它看起来像这样,即 HTML。这个回复是一个字符串,现在我的问题是在 JavaScript 中过滤它,使其成为一个对象数组

 <table border='1' frame = 'void'>
    <tr>
    <th>name</th>
    <th>age</th>
    <th>date of birth</th>
    </tr>
    <tr>
     <td>John</td>
     <td>30</td>
     <td>10.09.1987</td>
    </tr>
    </table>

我的问题是如何使用 vuejs 在对话框中显示此 HTML 数据。 我希望这个值是这样的对象数组

   [
     name,
     age,
     data of birth,
    john,
    30,
    10.09.1987
   ]

最佳答案

这不是 Vue.js 问题,而是 HTML/JavaScript 问题。您可以迭代单元格文本内容并将其转换为数组,如下所示。

var stringFromREST = "<table border='1' frame='void'><tr><th>name</th><th>age</th><th>date of birth</th></tr><tr><td>John</td><td>30</td><td>10.09.1987</td></tr></table>";

var tempDiv = document.createElement('div');
tempDiv.innerHTML = stringFromREST;

var cells = tempDiv.querySelectorAll('th,td');

var contentArray = [];
for (var i = 0; i < cells.length; i++) {
  contentArray.push(cells[i].innerText);
}

console.log(contentArray);

关于javascript - 在 Vuejs 中读取 HTML 响应并将其显示在对话框中,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/48906829/

相关文章:

javascript - 从 laravel 到 vue.js 验证后如何显示数组响应的错误(基于索引)

javascript - 如果仅选中 1 个复选框,则启用按钮。否则禁用按钮

javascript - Node JS block 文件作为一个文件读取而不中断?

javascript - Vue表格行中的多条件

javascript - 类型 'XXX' 上不存在属性 'CombinedVueInstance<Vue, {}, {}, {}, Readonly<Record<never, any>>>'

javascript - Vue.js API 获取

javascript - jQuery - 显示/隐藏多个模式

javascript - JQuery - CSS 编辑器?有吗?

vue.js - 为什么我的 bootstrap-vue b-table 列标题不在部署中居中?

webpack - 初始化 vue-cli 时颁发者证书问题