主要观点:介绍了[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/html
、image/svg+xml
等。 - 有流式模式、插入模式(
append
、prepend
)。 - 具备延迟加载功能(
eager
、lazy
、none
)。 - 安全方面有多种措施,如 CSP、CSRF 防范、CORS 策略及元素级的安全限制。
- 支持声明式 Shadow DOM 及相关样式化。
- 触发多种事件,如
loadstart
、load
、loadend
、error
、beforeinsert
、inserted
等。
重要细节: - 示例代码展示了
[i-html]
的各种用法,如在不同链接和表单中使用、设置目标元素、内容刷新等。 - 解释了不同状态(
waiting
、loading
、streaming
、loaded
、error
)的含义及样式化方式。 - 对比了
[i-html]
与其他类似元素(如[htmx]
、[htmz]
、[include-fragment]
)的差异,包括功能、设计决策等方面。
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。