使用 src 和 alt 替换图像答案

【问题标题】：Working with src and alt to replace an image使用 src 和 alt 替换图像
【发布时间】：2018-06-29 12:55:13
【问题描述】：

我的网站中有一个部分致力于更改语言。现在，在一个圆形按钮中，我有英国国旗。这是默认选项。

  <a class="nav-link-language  js-language-trigger">
    <img src="http://my-site.test/wp-content/uploads/2018/04/260-united-kingdom.png" alt="">

例如，我有德语选项

    <div class="nav-link-language-holder">
      <a><img src="http://my-site.test/wp-content/uploads/2018/04/260-germany.png" alt=""><i>German</i></a>
    </div>

javscript如何设置，当用户点击德国的图标时，它将被替换为默认选项（现在是英国）

非常感谢

【问题讨论】：

你试过什么？！
默认选项是什么意思？您究竟想在您的网站上替换什么？您的标签在“nav-link-language-holder”类中的 src？
当用户点击德国图标时，您的页面是否会重新加载？如果是这样，您应该在呈现页面时处理src。如果没有，则为click 添加一个event listener 并让它运行一些javascript 来更改图标。
顺便说一句；旗帜不是代表语言的好方法——尤其是在比利时或卢森堡等地。
@DanielBürckner 我的意思是默认选项是在按钮上设置的用于更改语言的图像。我希望它在我单击其他选项时更改（例如，当我单击德国国旗时，它会变为默认值

标签： javascript php html src alt

【解决方案1】：

这是更改您的 img src 的快速方法：

<img id="Your_IMG_ID" src="olg-img-src.png">
<button onclick="change_img_src()">Change SRC</button>
<script>
function change_img_src() {
    document.getElementById("Your_IMG_ID").src = "new-img-src.png";
}
</script>

为了概括您正在寻找的内容并进一步简化它，这里有一种方法：

<!--- Your main flag --->
<img id="main-flag" style="cursor:pointer" src="img.png"/>

<!--- Rest of flags --->
<img style="cursor:pointer" onclick="Change_flag(this.src)" src="img.png"/>
<img style="cursor:pointer" onclick="Change_flag(this.src)" src="img-2.png"/>
<img style="cursor:pointer" onclick="Change_flag(this.src)" src="img-3.png"/>
<!----Other flags---->
<script>
function Change_flag(_src) {
    document.getElementById("main-flag").src = _src;
}
</script>

【讨论】：

不客气 :) 你可以去掉那个按钮，让你的 img 本身成为一个按钮，并执行其他的事情，比如在 js 代码中更改语言 cookie。祝你玩你的脚本好运：D
效果很好，谢谢。但只是一个问题。我的html中已经有了png文件的地址，我不想在javascript文件上再写，你能用这种方式改变你的代码吗？
@AbdennOur 这部分我的意思是：.src = "new-img-src.png";
我会看看我能做什么，据我了解，您需要获取已显示标志的来源并将它们替换为您的主要（默认）标志对吗？