Javascript 如何使此按钮具有两次单击事件？

到目前为止，我的程序将创建这些嵌套的div，并在最里面的div中反复创建一个图像

我知道我可以在同一次点击中使多个事件发生，但在这种情况下，我需要它们一个接一个地发生。因此，单击#1将生成嵌套div和图像#1，但单击#2将生成嵌套div和图像#2。单击#3将显示图像#1，依此类推。偶数点击将显示偶数图像，奇数显示奇数图像。我

dk如果需要再次创建所有div，或者只需要交换映像

如果它有帮助的话（我还没有接受，所以我还不想问）…最终我还需要创建一个文本框来跟踪点击量，并使用当前的文本框值来更改图像

var i=0；
函数runTogether1（）
{
addDiv（）；
addDiv2（）；
addDiv3（）；
addbutterfly（）；
}
函数addDiv（）
{
var div1=document.createElement（'div'）；
div1.classList.add（'div1'）；
文件.正文.附件（第1部分）；
}
函数addDiv2（）
{
var div2=document.createElement（'div'）；
div2.classList.add（'div2'）；
document.getElementsByClassName（“div1”）[i].appendChild（div2）；
}
函数addDiv3（）
{
var div3=document.createElement（'div'）；
div3.classList.add（'div3'）；
document.getElementsByClassName（“div2”）[i].appendChild（div3）；
}
函数addbutterfly（）
{
var img=document.createElement（'img'）；
img.src=“gorilla.bmp”；
document.getElementsByClassName（“div3”）[i].appendChild（img）；
i++；
}

.div1{
背景色：红色；
边缘：1米；
高度：250px；
宽度：250px；
证明内容：中心；
对齐项目：居中；
}
.第2分部{
背景颜色：黄色；
高度：150像素；
宽度：150px；
}
.第3分部{
背景色：柠檬黄；
高度：75px；
宽度：75px；
}
div{
显示器：flex；
证明内容：中心；
对齐项目：居中；
位置：相对位置；
}

单击以获取嵌套的div

创建一个全局布尔变量，您可以在每次运行

runTogether（）时切换该变量。

如果为真，请运行“奇”函数，然后将切换设置为假，否则，请运行“偶”函数并将切换设置为真。

如果我理解正确，您希望第一次单击即可创建div和image，并显示一个特定的图像，然后单击以保持相同的div，但只是将图像调出

如果是这种情况，最简单的方法就是保留对

属性的引用

您可以使用
%
（模）运算符来处理奇数/偶数确定，它基本上返回两个数字的其余部分，因此
1%2=1
，
2%2=0
，
3%2=1
，等等。这意味着
i%2
对于偶数总是返回
0
，对于奇数总是返回
1

function runTogether1() 
  {
    // Initial Call, create elements
    if (i === 0) {
      addDiv();
      addDiv2();
      addDiv3();
      addbutterfly();
    } else {
      var img = document.getElementByTagName('img')[0];
      if ((i % 2) === 0) {
        img.src = 'even-image-src.jpg';
      } else {
        img.src = 'odd-image-src.jpg';
      }
    }
  }

谢谢你的指导，这对我来说很有意义。我会试试看。不要把javascript放在HTML的内联部分，例如使用AddEventLitteners而不是onclick=x，因为这会使编码更容易。如果可以通过更新变量来执行相同的操作，则不要复制类似的代码。例如，除了数字1、2、3之外，所有函数都是相同的，您可以用单个函数替换它，并传入一个变量值，该变量值可以是1、2或3。要从1到2再到1到2，可以使用模运算符“%”，例如
int%2
。对不起，我不能准确地回答这个问题，我不完全理解，你的问题也没有以一种可以理解的方式表达出来。