如何使表响应，创建于 javascript

Question

我有一个js，它为我生成了一个表，我在html中显示了它，但是我无法使其响应； 我该如何解决

代码如下，我已经用responsive table修改了，但是还是不行

var tabla   = document.createElement("table");
tabla.className="table";

var thead = document.createElement("thead");

let row_1 = document.createElement('tr'); 
let heading_1 = document.createElement('th');
heading_1.scope="col";
heading_1.innerHTML = "Mes";
let heading_2 = document.createElement('th');
heading_2.innerHTML = "Cuota";
heading_2.scope="col";
let heading_3 = document.createElement('th');
heading_3.innerHTML = "Interes";
heading_3.scope="col";
let heading_4 = document.createElement('th');
heading_4.innerHTML = "Amorti.";
heading_4.scope="col";
let heading_5 = document.createElement('th');
heading_5.innerHTML = "Capital";
heading_5.scope="col";
let heading_6 = document.createElement('th');
heading_6.innerHTML = "Seguro Desgrav.";
heading_6.scope="col";
let heading_7 = document.createElement('th');
heading_7.innerHTML = "Seguro Inmobil.";
heading_7.scope="col";

let heading_8 = document.createElement('th');
heading_8.innerHTML = "Gastos Adm.";
heading_8.scope="col";

let heading_9 = document.createElement('th');
heading_9.innerHTML = "Cuota Final";
heading_9.scope="col";



row_1.appendChild(heading_1);
row_1.appendChild(heading_2);
row_1.appendChild(heading_3);
row_1.appendChild(heading_4);
row_1.appendChild(heading_5);
row_1.appendChild(heading_6);
row_1.appendChild(heading_7);
row_1.appendChild(heading_8);
row_1.appendChild(heading_9);
thead.appendChild(row_1);

Answer 1

尝试在 HTML 中创建表。

 <div style="overflow-x:auto;"> <table>... </table> </div>

然后填充 Js 中的字段。

Answer 2

如果您不使用任何响应式 CSS 框架，如Bootstrap或我的最爱（为了简单起见，它提供） W3.CSS ， 这可能会有所帮助