javascript - 获取 HTML 并插入到 DOM 中，但相对于特定路径进行解析

Question

假设我在 /path/fragment.html 中有这个 html 片段:

<h1>Hi there</h1>

<img src='./image.jpg'/>

我可以轻松获取此文件并将其插入到 DOM 中:

const dom = document.getElementById('root');
const response = await fetch('/path/fragment.html');
const fragment = await response.text();
dom.innerHTML = fragment;

但是，图像是相对于调用 JavaScript 的任何 HTML 文件加载的，因此显然是 404。有没有办法设置innerHTML，使其像在 /path/ 中一样解析片段，从而正确加载图像(以及任何其他相对路径资源)？

Answer 1

@Michael Crenshaw 已经指出了很多可能的解决方案，但这是我的

使用绝对路径。这样路径就永远是正确的。