使用 HTML 和 JavaScript 创建 Excel 格式输出
我接受了采访,问的问题是:
编写一个 JS 插件,可以将单元格和值作为输入并在浏览器上呈现 excel 格式输出。例如,
给定输入(单元格和值):
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
}
他们说这对于大量单元格输入来说效率不高。我建议我们可以使用 Matrix 创建表
A B... J K ....
1 [ 10 ]
2 20
3 5
I had interview and question asked was:
Write a JS plugin that can take cell and value as input and render excel format output on browser. For example,
Given Input (cell and value):
J3 = 5
A2 = 20
K1 = 10
Output on browser should be in excel format
A B C ....... J K .......
1 10
2 20
3 5
..
I Was looking for correct solution for the problem.
I tried solving this problem (writing psudeo code)
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
}
They said it won't be efficient for huge number of cell inputs. I suggest that we can use Matrix create table
A B... J K ....
1 [ 10 ]
2 20
3 5
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
我认为你一开始就很好。首先创建一个包含元素的表。其宽度为 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
然后,您可以通过以下方式最有效地访问表格单元格:
I think you started off well. Begin by creating a table that will contain the elements. This will be 26 columns wide and as tall as the largest y value. Convert the letters to numbers.
Sorry for w3schools link, I'm liable to get downvoted for even mentioning them, but they have the best laid out documentation on the table object that I could google for you. I will update it if someone has something better.
http://www.w3schools.com/jsref/dom_obj_table.asp
MDN Tutorial
https://developer.mozilla.org/en/Traversing_an_HTML_table_with_JavaScript_and_DOM_Interfaces
You can then access the table cell most efficiently through
Excel 电子表格是表格。你能用一个简单的表格吗?如果是这样,我会推荐 CSS border-collapse 属性以使其看起来更好,以及可能减少单元格填充和边距。
Excel spreadsheets are tables. Can you use a simple table? If so, I would recommend the CSS border-collapse property to make it look better, as well as perhaps reducing cell padding and margin.