先看证据
从一个占位元素开始的麻烦
Lean Rada 介绍了一种用 `document.currentScript` 做内联渲染的写法:把经典 `<script>` 放在内容应出现的位置,让脚本执行时替换自己。例子针对的是静态页面里那些很小的动态片段,例如显示年份或相对日期。Simon Willison 在 2026 年 10 月 17 日的链接文章中介绍了这项做法。
常见的另一条路,是先在 HTML 中放一个带 `id` 的占位元素,再由另一段 JavaScript 查找它并填入内容。内容很少时,这会把“在哪儿显示”“怎样找到位置”和“生成什么”拆散到不同地方。Rada 的做法把脚本移到输出点,省下的是额外的定位标记和查找步骤。
这并不是动态渲染能力突然增加了,而是代码与标记之间的关系变得更直接。对技术负责人来说,值得读的地方在于它展示了一种局部简化:在不引入模板层的情况下,让一小段页面逻辑更自包含。这个取舍是否有用,取决于页面需求是否真的小而局部。
脚本先是代码,再是临时锚点
机制依赖一个明确的执行时机。在经典脚本正在执行时,`document.currentScript` 返回当前的 `<script>` 元素;调用 `replaceWith()` 后,脚本元素就能被文字或节点替换。例如,`document.currentScript.replaceWith(new Date().getFullYear())` 会把算出的年份放回脚本原先所在的位置。脚本因此短暂充当 DOM 锚点,输出完成后页面留下的是生成内容。
Rada 还展示了一个简写:`$=(...n)=>document.currentScript.replaceWith(...n)`。页面随后可以把 `The year is <script>$(new Date().getFullYear())</script>` 当成一种更紧凑的表达。它看起来像迷你模板语法,但实际做的仍是一件窄得多的事:执行当前脚本,把给定的值或节点放到当前位置,并没有提供模板系统的结构管理或数据绑定能力。
同一种定位思路也能用于局部交互。文章的例子通过 `document.currentScript.parentElement` 找到同一父元素中的计数文本和按钮,再为按钮绑定事件。这说明脚本可以从自身出发组织附近的小片段,而非每次都从全局查询页面。不过,行为一旦跨出这个局部范围,脚本与页面结构之间的关系就未必仍然清楚。
局部定位有时间和脚本类型边界
“就地”不代表脚本在任何时刻都能重新找到自己。若内容要等 `fetch()` 等异步操作完成后才生成,回调运行时不能假定 `document.currentScript` 仍指向原脚本。做法是在启动异步操作前保存脚本元素的引用,等结果返回后再用这个引用替换它。锚点可以延迟使用,但必须由代码明确保留。
脚本类型也会改变可用性。材料依据 HTML 标准和 MDN 指出,模块脚本中 `document.currentScript` 返回 `null`,在事件处理器或回调执行时它也不会自动指回最初的脚本。因此,不能只看代码是否写在某个位置,就推断这项技巧可以用于所有 JavaScript 执行环境。材料所述的 API 自 2015 年 7 月起已在主流浏览器中广泛可用,但广泛支持并不能消除这些使用条件。
作者曾经写过这种方法不能用于数据驱动模板,后来修正了这项说法:保存脚本引用后,异步数据返回时也可以替换内容。这个修正不是机制前后矛盾,而是把边界说得更准确。限制不在于它只能处理常量,而在于异步阶段已经不能依赖 `currentScript` 这个即时属性,必须管理好脚本元素引用的生命周期。
代码变短不等于页面变快
对于以静态 HTML 为主的博客或说明页,这种方法可以把年份、相对日期等零散内容放在原位置,也可以让一小段交互逻辑贴着它操作的文本和按钮。它的工程价值主要是减少标记与脚本之间的来回定位,让读者更容易看出某段代码负责页面的哪一处。若项目原本就有成熟的模板约定,这种局部便利未必能抵消另添一种写法带来的维护成本。
现有材料没有提供它与模板引擎、服务端渲染或框架的性能基准,也没有量化解析或渲染阻塞的变化。因此,不能从“少一个占位元素”推导出“页面更快”,也不能把代码简短当作架构优越性的证据。相关资料提到外部脚本可能造成解析和渲染阻塞,但没有给出这项内联技巧在具体页面上的耗时比较。
安全边界同样不会因为脚本就地替换而消失。如果用 `innerHTML` 或 `outerHTML` 插入外部数据,仍须先清理 HTML。实际判断可以落在需求尺度上:内容少、位置固定、使用经典内联脚本时,可以考虑用它省掉占位和查找;若页面需要复杂结构、多个数据来源或模块化组织,就不应把这个小技巧升级成模板系统的替代品。严格 CSP 等部署问题也不在现有材料的证据范围内,采用前需要结合项目自身约束另行确认。