代码之家 › 专栏 › 技术社区 › JustStartedProgramming

在Vuejs中读取HTML响应以在对话框中显示

vuetify.js vuejs2 vue.js javascript

JustStartedProgramming · 技术社区 · 7 年前

我从服务器收到一个HTML格式的REST请求响应。我将其存储在一个数据:[]中,当我在控制台上打印它时,它看起来像这样,即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
   ]

1 回复 | 直到 7 年前

acdcjunior Mukul Kumar 7 年前

这不是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);

推荐文章

Veer3383 · 如何更改/覆盖Vuetify js中禁用字段的默认颜色?

7 年前

Peter Krauss · emit go modal在其他实例中什么都不做,如何调用modal?

7 年前

Yuri F Becker · 在vue中以编程方式创建表单

7 年前

L. Gangemi · Vue+Vuetify扩展面板输入/离开动画

7 年前

niutech · 如何异步验证Vuetify文本字段?

7 年前

Jay Vignesh · VueJs-在方法之间传递变量

7 年前

JustStartedProgramming · 在Vuejs中读取HTML响应以在对话框中显示

7 年前

Raluca · 在滑块中获取居中元素的对象

7 年前

tobiasg · 将new Date()与v-Date-picker一起使用不起作用

7 年前

IsraGab · 动态内容到v-expansion-panel-content

7 年前