JavaScript outerHTML编码URL字符串

Question

我正在尝试将图像的src属性设置为JS中生成的URL。该URL包含多个用"&"链接的参数，但当将元素的外部HTML作为字符串值获取时，所有"&"都被替换为"&amp ;"，使URL无效。为什么会发生这种情况？我需要替换所有出现的"&"来解决它吗？

var img = $("<img>");
img.attr("src","/test?param1=1&param2=2");
console.log(img[0].outerHTML); //printing <img src="/test?param1=1&amp;param2=2">

从该对象获取src属性显示原始字符串，因此我认为在访问outerHTML时该值已被编码。

- user1563232

---

你使用 outerHTML 的场景是什么？ - charlietfl

这基本上是一个编辑器，为一种相当特殊的用途生成HTML代码，我认为没有更好的方法来做到这一点。 - user1563232

Answer 1

这只是通过使用 outerHTML 记录 img 的结果，因为该函数在输出之前序列化字符串。在下面的示例中，我只是记录元素，您将看到图像源是正确的。此外，如果在页面上输出图像，则也具有正确的源。

因此，除了记录输出的方式之外，您的代码没有任何问题。

var img = $("<img>");
img.attr("src","http://www.placecage.com/gif/284/196?param1=1&param2=2");
console.log(img[0]);
$("div").append(img);

<div></div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

- WizardCoder

---

好的，你是对的，我在别处找到了问题所在。它被序列化是因为我使用text()设置文本框的内容，这样HTML代码就可以被复制。有没有其他方法可以显示纯HTML代码而不改变其内容？ - user1563232