Hacker News 中文摘要

RSS订阅

网络弃用软件:你可知HTML表格API的存在? -- Abandonware of the web: do you know that there is an HTML tables API?

文章摘要

文章介绍了HTML表格API这一被遗忘的功能,指出开发者可以直接操作表格元素(如行、列、表头等),无需重新渲染整个表格或使用innerHTML,既提升性能又更安全。文末提供了通过嵌套数组创建表格的代码示例。

文章总结

标题:被遗忘的网页遗产:你了解HTML表格API吗?

主要内容: 1. 开发者通常使用DOM方法或innerHTML来创建HTML表格,但后者存在安全隐患。实际上,HTML表格拥有一个鲜为人知的古老API

  1. 这个API支持以下功能:
  • 遍历表格元素
  • 创建表体、行、单元格、表头、页脚、标题和摘要
  • 直接访问表格单元格
  • 局部更新表格而无需整体重绘
  1. 通过Codepen示例展示了如何用嵌套数组创建表格: javascript let table = [['one','two','three'], ['four','five','six']]; let t = document.createElement('table'); table.forEach((row,ri) => { let r = t.insertRow(ri); row.forEach((l,i) => { let c = r.insertCell(i); c.innerText = l; }) });

  2. API特性说明:

  • 支持通过索引访问单元格(如t.rows[1].cells[1]
  • 可动态增删行列(使用insertRow(-1)在末尾添加行)
  • 当前限制:无法创建TH元素,所有单元格均为TD类型
  1. 作者建议:
  • 该API值得重新审视并增强功能
  • 可借鉴HTML表单的改进经验(如formData和change事件)
  • 强化表格作为数据结构的地位,而非仅作为布局工具

(注:原文中的图片链接和部分代码细节已保留,但移除了与核心内容无关的描述)

评论总结

评论内容总结:

1. 表格布局的过时性

  • 观点:部分开发者认为表格布局已被Flex和Grid取代,不再有使用场景。
  • 引用
    • "Tables died (thankfully) to make room for flex and grid. I can't see any use case for them at all anymore."(评论1)
    • "I remember doing this 25 years ago, but I assume (and hope) it's a huge minority who do this today?"(评论2)

2. 表格API的实用性与现代应用

  • 观点:仍有开发者认为表格API在某些场景下非常实用,尤其是键盘导航和数据展示。
  • 引用
    • "Using rows and cells is very convenient for keyboard navigation across table cells."(评论4)
    • "I still use this pretty much everywhere to create HTML tables. Do people use something else now?"(评论10)

3. 代码风格与可读性争议

  • 观点:部分评论对示例代码的变量命名提出批评,建议使用更具描述性的命名。
  • 引用
    • "Use full words for variable names!"(评论5)
    • "The variable naming convention used here could be improved for clarity."(评论6)

4. 表格API的性能问题

  • 观点:有开发者指出表格API在动态生成时性能较差,字符串拼接可能更快。
  • 引用
    • "I vaguely remember this API being much slower than making rows/cells via strings."(评论11)
    • "Re-rendering only happens when the current task queue element has been processed."(评论17)

5. 对现代框架与语义化的反思

  • 观点:部分开发者认为现代开发过度依赖<div>,导致语义化标记的缺失。
  • 引用
    • "Not sure when it was (10-15 years ago), but at some point everything became <div>s."(评论8)
    • "I had no clue that nowadays programmers don’t know about this, so I assume it’s supplanted by modern frameworks."(评论9)

6. 对API改进的期待

  • 观点:部分开发者希望表格API能进一步改进,尤其是功能扩展(如搜索、排序等)。
  • 引用
    • "There are no search, filter, sort, or selection features that you get."(评论16)
    • "I’m curious what changes the author would like to see to the API."(评论7)

7. 怀旧与历史回顾

  • 观点:部分开发者回顾了表格布局的历史意义及其对现代Web开发的影响。
  • 引用
    • "Tables were the only way to create browser independent layouts dynamically."(评论18)
    • "It was pretty common to have large one file websites: php and html with css and javascript mixed."(评论18)

8. 对其他API的担忧

  • 观点:有开发者提到其他API(如IndexedDB)也可能面临被忽视的问题。
  • 引用
    • "I feel like IndexedDB is becoming this abandonware as well."(评论15)
    • "Will Google remove this API then if it’s abandoned?"(评论14)