javascript动态更改图像src的位置-无JQuery

我用同样的方法设置了好几页。每个页面大约有10到15个图像，如果单击这些图像，图像会发生变化并变得不可读取。 我的代码是：

function ToggleOnclick(elID)
{
var el = document.getElementById(elID);
var loc = document.getElementsByClassName("wrapper");

if (el.onclick)
{
        // Disable the onclick
        el._onclick = el.onclick;
        el.onclick = null;
        el.src = loc.id + "/" + el.name + "Clicked.png";
}
}

图像的html为：

  ....
  <div class="content">
   <div class="wrapper" id="som">
   <div class="img0"><img src="som/doos.png" alt="doos" name="doos" id="doos" onclick="ToggleOnclick(this.name);" /></div>
   <div class="img1"><img src="som/beer.png" alt="beer" name="beer" id="beer" onclick="ToggleOnclick(this.name);" /></div>
   <div class="img2"><img src="som/bel.png" alt="bel" name="bel" id="bel" onclick="ToggleOnclick(this.name);" /></div>
   ....

。。。。
....

因为我需要制作大约20个html文件，所以我有了添加图像的源位置作为wrapper-div的id标记的想法

我对javascript知之甚少，很难找到我想要的东西。也可能是因为我不是以英语为母语的人，也不知道我到底在找什么

请记住，我的文件：

由于我们客户的规格，必须在较旧的浏览器版本中工作

无法用JQuery修复（请不要在评论或回答中讨论这个问题。我不能在这个项目中使用它。它不适合讨论。）

tldr；我需要一种基于包装器div的id标记设置img src的方法，它提供一个集合而不是一个元素

将元素传递给

ToggleOnclick

，这样就不必在函数中获取它

function ToggleOnclick(el)
{
//var loc = document.getElementsByClassName("wrapper")[0];//assuming there is only one wrapper
if (el.onclick)
{
        // Disable the onclick
        el._onclick = el.onclick;
        el.onclick = null;
        //el.src = loc.id + "/" + el.name + "Clicked.png";
        el.src = el.src.replace(".png", "Clicked.png");
}
}
<img src="som/doos.png" alt="doos" name="doos" id="doos" onclick="ToggleOnclick(this);" />

功能切换点击（el）
{
//var loc=document.getElementsByClassName（“包装器”）[0]；//假设只有一个包装器
如果（el.onclick）
{
//禁用onclick
el._onclick=el.onclick；
el.onclick=null；
//el.src=loc.id+“/”+el.name+“Clicked.png”；
el.src=el.src.replace（“.png”，“Clicked.png”）；
}
}

您上面发布的代码看起来不错，问题出在哪里了？？Whcih元素有onclick处理程序，

.content

？我注意到的唯一一件事是，您可以从整个文档中获取所有包装器元素。你是说

el.getElementsByClassName

？@yogi，当我点击时图像不会改变them@TorstenWalteronClick在图像中，如果向右滚动，您将看到它被调用。而且包装器只使用一次，所以matterI没有尝试过：onclick=“ToggleOnclick（this.name，“som”）；”和在javascript函数中ToggleOnclick（elID，loc）和el.src=loc+“/”+el.name+“Clicked.png”；但那不起作用。对不起，我不得不接受这个答案。GetElementsByCassName的浏览器支持不够，我需要它在较旧的浏览器中工作[link]您可以使用getElementById（“som”）不，我不能，因为“som”是动态位置。在另一个练习中，这将是“juf”。我正在尝试为wrapper-div切换id和class。对我来说，在这种情况下，css引用id或类没有什么区别，因为这是一个如此基本的结构。这个解决方案非常简单，非常出色：）