开源布道者 Simon Willison 近期转发了开发者 Lean Rada 记录的一项行内渲染微型技巧:利用原生 API document.currentScript 配合 replaceWith(),开发者无需事先在 HTML 中放置占位容器,就能让行内脚本在执行时将自身替换为动态文本。这项极简方案迅速在前端社区扩散,不少静态博客作者将其奉为免除复杂框架的灵巧发明。
但这种惊艳感主要源自对现代 Web 工程现实的脱敏。它本质上是早期行内执行逻辑在现代 DOM 接口下的重装亮相,不仅无法跨越 ES 模块(ES Modules) 的天然边界,也难以通过正规生产环境的 CSP(内容安全策略) 审查。
原地自毁:免除占位容器的轻量黑魔法
在构建静态页面或轻量个人网站时,插入一段随时间变化的动态信息极为常见,最典型的场景便是页面底部的版权年份。按照现代前端惯例,开发者往往需要先书写一个带有唯一标识的占位元素,再通过查询脚本修改其内容。

Lean Rada 提出的方案打破了这种繁琐:
The year is <script>document.currentScript.replaceWith(new Date().getFullYear())</script>
将其抽象为简写函数 $ = (...n) => document.currentScript.replaceWith(...n) 之后,这行代码即可充当微型行内模板引擎。
从技术机制来看,这一模式直接调用了两个早期的浏览器原生标准。MDN 文档显示,document.currentScript 早在 2015 年 7 月 就已获得各大浏览器广泛支持,而 Element.replaceWith() 也在 2018 年 4 月 完成了主流覆盖。与早期臭名昭著的 document.write() 相比,replaceWith() 将字符串作为纯文本节点插入,不仅不会破坏性地清空或重新解析整个文档流,还能避免富文本字符串被意外解析为 HTML 标签,降低了部分注入风险。
- 结论.对于无构建流水线、无庞大运行时依赖的单页或个人博客,这种零依赖写法提供了难得的轻便。
现代断层:模块化与异步执行的硬墙
虽然在简单脚本片段中运行流畅,但这套机制在现代工程架构中几乎没有立足之地。现代前端工程全面依托 ES 模块化体系,而规范明确规定:在带声明 type="module" 的脚本环境中,document.currentScript 始终返回 null。

这意味着使用 Webpack、Vite 等现代工具打包输出的模块代码,天然无法读取这一属性。浏览器标准推荐模块采用 import.meta 读取上下文,直接阻断了该技巧在现代前端流水线中的应用。
更为棘手的是执行时序。document.currentScript 仅仅在浏览器同步解析、执行该脚本块的瞬间指向其对应的 DOM 节点。一旦逻辑进入 setTimeout 定时器、Promise 回调或网络请求等异步阶段,当前执行上下文中的 document.currentScript 就会失效。如果开发者希望在异步获取数据后再完成原地渲染,必须在最初的同步代码块中显式暂存该节点引用,极简模板的语义不复存在。
策略绞杀与标准路径的取舍
对企业级项目和应用安全团队而言,此类技巧更是违背了纵深防御的准则。现代生产环境普遍启用了 Content Security Policy(CSP),配置形如 script-src 'self' 的安全策略会直接禁止任何非外链的内联脚本执行。

试图在生产环境依赖内联自毁渲染,无异于要求安全团队为一个小把戏拆除整座城防。
若要强制执行内联脚本,服务端必须为每一个 <script> 标签生成动态的 nonce 验证凭据或预先计算哈希值,原本为了省去占位标签带来的轻便性瞬间被庞大的安全维护成本抵消。
WHATWG HTML 规范对早期同步插入机制的风险早有论述。尽管 document.write() 会阻断解析器甚至在特定时序下清空已有文档,但规范并不鼓励开发者重回内联散落逻辑的老路。当面对无框架轻量渲染需求时,平台标准提供了更稳健的替代路径:
- 服务端渲染(SSR).在文档送达客户端前完成静态文本计算,从根源上消除运行时计算消耗与安全风险。
- Web Components 与 Template:利用
<template>配合自定义元素,在保证结构、样式与行为解耦的同时,维持零外部依赖。 - 声明式 Shadow DOM.在不依赖客户端 JavaScript 运行时的情况下,安全完成组件内联组装。
- 提醒.不要因为少写一个容器标签,而把零散的内联脚本逻辑重新撒回大型项目的 HTML 骨架中。
这种利用历史 API 组合出的奇技淫巧,是个人开发者在微型项目中体会底层 DOM 弹性的有趣尝试。但若将其视为现代组件化与渲染范式的革新,则是错把过往的技术回响当成了前行的号角。
