为什么在 Dom 对象中将变量分配给自身会有所不同

Why does assigning a variable to itself in a Dom Object make a difference

我有一个 HTML 字符串,在我的示例中称为 tinymceToHTML 我遇到了问题,当我下载这个 html 字符串时,图像源或 hrefs 设置错误。

我的图像源在原始字符串中看起来像“/file/:id”,如果我将它转换成一个 DOM 对象并输出它看起来像“http://localhost:3000/file:id”的源所需的输出,因为外部文档可以加载此文件。所以我想出了这个解决方案。

        var div = document.createElement('div');
        div.innerHTML = tinymceToHTML;
        var images = div.getElementsByTagName('img');
        for(var i = 0; i < images.length; i++) {
          images[i].src = images[i].src;
        }
        var a = div.getElementsByTagName('a');
        for(var i = 0; i < a.length; i++) {
          a[i].href = a[i].href;
        }
        tinymceToHTML = "<html><head></head><body>" + div.innerHTML +
                        "</body></html>";

我的问题是我不知道为什么将变量分配给自身会在这种情况下有所不同:images[i].src = images[i].src 或 a[i].href = a[我].href.

如果我让程序向我显示带有警报框的输出,它会告诉我我想要的 URL,但如果没有该分配,程序将不会执行它应该执行的操作。

我希望任何人都可以向我解释这种效果,以便更改代码以使其更清楚地表明这一行是必需的。

我还创建了一个 fiddle 示例,可以更轻松地显示我的意思,注释掉作业所在的行,以查看其他结果

https://jsfiddle.net/1vabgubh/5/

根据定义,图像的完整 URL 就是 imageElement.src returns。来自 MDN:

HTMLImageElement.src Is a DOMString that reflects the src HTML attribute, containing the full URL of the image including base URI.

如果这就是您需要它们出现在最终字符串中的方式,那么 images[i].src = images[i].src 似乎是一种合理而简洁的方法。我只想添加评论以帮助理解,例如

images[i].src = images[i].src; // force the src to be the full URI