使用HTML和JavaScript創建Excel格式輸出

Question

我接受了采訪，問的問題是：

編寫一個可以將單元格和值作為輸入並在瀏覽器上呈現excel格式輸出的JS插件。 例如，

給定輸入（單元格和值）：

J3 = 5
A2 = 20
K1 = 10

瀏覽器上的輸出應為Excel格式

   A   B   C ....... J    K .......
1                         10
2  20 
3                    5
..

我正在尋找問題的正確解決方案。

我嘗試解決此問題（編寫偽代碼）

var  cell = {"J3": 5, "A2":20, "K1": 10}

// Function they will call for generate excel style table
generateExcel(cell, selector) {     
1.  create blank table  which has A-Z column (with selector as A-Z resp) and 1 to 100 rows (with selector as 1 to 100 resp)
2. Loop through each cell and for each cell
  2.1 find the column (J) and row (3)
  2.2 Add/replace value in that TD

3. Once all the information from cell in enter in table,  print the table in the document at given selector        

}

他們說，對於大量的細胞輸入來說，效率不高。 我建議我們可以使用矩陣創建表

   A   B...    J  K .... 
1 [               10      ]
2   20
3              5   

Answer 1

我想你起步很好。 首先創建一個包含元素的表。 這將是26列寬，與最大y值一樣高。 將字母轉換為數字。

對不起，w3schools鏈接，即使提到它們，我也很容易被打敗，但它們具有關於表對象的最佳布局文檔，我可以為您谷歌搜索。 如果有人有更好的東西，我會更新它。

http://www.w3schools.com/jsref/dom_obj_table.asp

MDN教程

https://developer.mozilla.org/en/Traversing_an_HTML_table_with_JavaScript_and_DOM_Interfaces

然后，您可以通過以下方式最有效地訪問表格單元格

var table = ;//get by id or create element, not sure what they expect
table.rows[y].cells[x].appendChild(...);

Answer 2

Excel電子表格是表格。 你可以用一個簡單的桌子嗎？ 如果是這樣，我建議使用CSS border-collapse屬性使它看起來更好，以及減少單元格填充和邊距。