i-html,一个内联 HTML 导入元素

主要观点:介绍了[i-html](https://github.com/keithamus/i-html),它是可动态导入 HTML 的标签,类似<iframe>但可将 HTML 融入页面,是[include-fragment-element](https://github.com/github/include-fragment-element)的精神继任者,功能丰富,如支持链接和表单的目标设定、表单操作、内容协商、流式模式、插入模式、延迟加载、安全措施(如 CSP、CSRF 防范、CORS 策略)、声明式 Shadow DOM 及样式化、事件等。
关键信息

  • 可通过 CDN 或 npm 引入脚本,有多种使用方式和属性。
  • 支持不同类型的内容协商,如text/htmlimage/svg+xml等。
  • 有流式模式、插入模式(appendprepend)。
  • 具备延迟加载功能(eagerlazynone)。
  • 安全方面有多种措施,如 CSP、CSRF 防范、CORS 策略及元素级的安全限制。
  • 支持声明式 Shadow DOM 及相关样式化。
  • 触发多种事件,如loadstartloadloadenderrorbeforeinsertinserted等。
    重要细节
  • 示例代码展示了[i-html]的各种用法,如在不同链接和表单中使用、设置目标元素、内容刷新等。
  • 解释了不同状态(waitingloadingstreamingloadederror)的含义及样式化方式。
  • 对比了[i-html]与其他类似元素(如[htmx][htmz][include-fragment])的差异,包括功能、设计决策等方面。
阅读 8
0 条评论