Javascript 使用JS单击后将图像放入HTML div

我正在制作一个简单的HTML页面，我想在用户选择一个选项后，在HTML中显示一个图像。可以出现许多不同的图像

  <img
        id="myImg"
        src="Image.jpg"
        width="107"
        height="98"
      />

---

谢谢

您进入的页面不知道您在来自的页面上所做的任何设置和更改

您将不得不将第一页上所做的更改传递到第二页

您可以通过设置带有图像名称的cookie（或使用localStorage）并在第二个页面中读取该名称，或者通过在URL查询字符串中的第二个页面的URL中传递新图像的名称，并使用URLSearchParams或您选择的其他方法检索它来实现

---

另一种选择是在第一个页面上生成JS中的第二个页面。

在同一站点上，可以通过多种方式将数据从一个页面传输到另一个页面，包括：

• 饼干
• 查询字符串
• 散列片段
• IndexedDB

但最简单、最干净、最直接的技术之一是：

• 网站存储（请参阅：）

它充当网站的页间内存

在这种情况下，一旦用户在一个页面上选择了一个图像，您可以将其存储为：

localStorage.setItem('selectedImage', 'my-image.jpg');

当另一个页面加载时，您可以通过以下方式检索所选图像：

localStorage.getItem('selectedImage');

---

进一步阅读：

---

您所说的“还需要它在另一个html上更新”是什么意思，请解释您的完整工作流程和期望的结果。您可以通过执行此

选项1

@VimalPatel我有一个2页的html站点来实现这一点。第1页有选择的选项，图像显示在下面。但我也希望它出现在第2页。@Rilla这就是我如何做到的。按钮按预期工作正常，我只需要在选择后图像也出现在第2页上。感谢您的回答，我将查看使用localStorage的情况。您可能还想投票，和/或更重要的是，接受其中一个答案，以防止问题仍然悬而未决。也就是说，如果您确实接受答案为“the”答案，当然是8-。谢谢，我将尝试localStorage，并在用户选择选项后查看是否可以将其放入工作区，在该函数中，我将添加localStorage.setItem（'selectedImage'，'my image.jpg'）；那么，我将如何使其出现在第二页的HTML中？抱歉，我只是一个初学者。我现在可以使用您建议的localStorage选项工作。非常感谢。干得好，@coding123ire-在你到达那里之前坚持不懈，干得好！您可能已经看到—如果您还没有看到，您需要知道—您可以随时使用浏览器开发人员工具手动查找

localStorage

中保存了哪些键和值。

localStorage.getItem('selectedImage');