如何在javascript中創建表格

-1

我正在嘗試創建一個簡單的東西，所以讓我試着解釋一下，它在什麼地方說「table here」應該出現在4列6行的表格中，細胞。如何在javascript中創建表格

不幸的是，我不知道如何使用Javascript。我已經有低於

代碼：

 <form name="part"> 
     <p align="center"> 
     &nbsp;</p> 
     <p align="center"> 
     <font face="Verdana" size="2">Please insert the part ID in the field 
     below:</font></p> 
     <p align="center"> 
     <font face="Verdana" size="2">Part ID</font><font face="Verdana"><font size="2"> </font><input type="text" name="userid" size="19"/></font></p> 
     <p align="center"><font face="Verdana"><font size="2"> 
     <p align="center"> 
     <input type="button" onclick="check(this.form)" value="Check now" style="font-family: Verdana"/><font face="Verdana" size="2"> 
     </font> 
     <input type="reset" value="Cancel" style="font-family: Verdana"/></p> 
    </form> 
    <font face="Verdana" size="2"> 
    <script language="javascript"> 
     function check(form) { 
      if(form.userid.value == "1"){ 
       document.write("table here"); 
      } 
      else if(form.userid.value == "2"){ 
       document.write("table 2 here"); 
      } 
      else { 
       alert("The Part does not esxist\nor does not have compatibility") } 
     } 
    </script>

我希望你能幫幫我！ :)

來源

2016-05-20 Mário Jorge Rocha

你有什麼試過？你做過任何研究嗎？做了你自己的任何嘗試，還是期待別人爲你做這項工作？ – NewToJS

您可以使用[dataTables]（https://datatables.net） – Beniton

使用[table]（http://www.w3schools.com/tags/tag_table.asp）標記。 – VHS

有很多方法可以在JavaScript中創建一個表，但可能是最基礎的，它不需要任何外部庫：

通過代碼：

var $table  = document.createElement('table'); 
var $table_row = document.createElement('tr'); // for each row 
var $table_cell = document.createElement('td'); // for each cell 

$table.appendChild($table_row);  // for each row 
$table_row.appendChild($table_cell); // for each cell 

document.body.appendChild($table); // eventually add the final table

通過HTML ：

<table> 
    <tr> 
     <td>Cell 1</td> 
     <td>Cell 2</td> 
     <td>Cell 3</td> 
    </tr> 
</table>

還有其他外部庫可能會幫助你，b這是黃銅。

一些有用的（基本）CSS可能通常是：

table{ 
    width : 100%; 
    border-spacing : 0px; 
    border-collapse : collapse; 
} 

/* and then styling the inner cells */ 

table td{ 
    padding : 3px; /* or whatever suits you */ 
    border : 1px solid #efefef; 
}

等等

外部庫如https://datatables.net/將幫助您採取一個數組（或對象數組）並將其轉換爲表...提供排序，搜索，分頁（分頁）等功能...

這樣，像這樣：

var data = [ 
    { name : "david", "age" : 25, "sign" : "aries" }, 
    { name : "daniel", "age" : 32, "sign" : "whatever" }, 
    { name : "motke", "age" : 18, "sign" : "falafel" } 
];

將被轉換成一個完全看錶這樣

名稱|年齡| Sign |
------------------------ |
David | 25 |白羊座|
Daniel | 32 |無論|
Motke | 18 |沙拉三明治|

原諒我那可憐的文字繪畫技巧...

如果你想借此到一個新的水平，你總是可以使用數據綁定框架，比如modular.js - http://modularjs.co.nf/ - 或角產生HTML tamplates在喜歡的：

<table> 
    <tr for="item in data"> 
     <td>{{item.name}}</td> 
     <td>{{item.age}}</td> 
     <td>{{item.sign}}</td> 
    </tr> 
</table>

這將讓你更多的控制如何顯示數據。在每個解決方案中的優點和缺點，只需選擇！

來源

2017-01-22 23:06:00 levi

如何在javascript中創建表格

回答

相關問題