对堆栈溢出来说相当新，对javascript来说也足够新。
希望这个问题不是以我的名义不清楚，以便人们理解。
我有一个问题，我有一个for循环，它在每个循环上显示我的内容，这是我最初需要它显示的方式，它也是完美的显示格式。
我现在有一个问题，我希望我的innerHTML输出'myarr[I]'的一部分只显示在每个奇数循环上，而不显示在偶数循环上，而其余部分仍然显示在每个循环上。。。
有什么建议吗？
var clicks = 0;
document.getElementById("arrowLink").innerHTML.value = clicks; // clickable arrow
document.getElementById("arrowLink").addEventListener("click", function()
{
if (clicks < 1)
{
for(var i=0; i < displayArr1.length; i++)
{
middleEndpoints.innerHTML +=
"<div class='d-flex justify-content-center'>"+
"<div class='p-2'>"+
"<p>Abc</p>"+
"</div>"+
// HOW DO I GET THE BELOW PART OF MY CODE TO ONLY DISPLAY ON EVERY ODD OR SECOND LOOP?
"<div class='row'>"+
"<div class='col-sm-1 align-self-center'>"+
"<p style='margin-bottom: 0;'>" + myArr[i] + "</p>"+
"</div>"+
//----------------------------------------------------------------------------
"<div class='col-sm-10 align-self-center'>"+
"<p class='midLine'>⇅</p>"+
"</div>"+
"</div>";
}
clicks += 1;
}
});
在JavaScript中，使用模%运算符来确定一个数字是奇数还是偶数。
偶数是可以被2整除的数。 因此，对给定的数字执行%2运算，如果结果为0，则给定的数字为偶数，否则给定的数字为奇数。
var clicks = 0;
document.getElementById("arrowLink").innerHTML.value = clicks; // clickable arrow
document.getElementById("arrowLink").addEventListener("click", function(){
if (clicks < 1) {
for(var i=0; i < displayArr1.length; i++) {
middleEndpoints.innerHTML +=
"<div class='d-flex justify-content-center'>"+
"<div class='p-2'>"+
"<p>Abc</p>"+
"</div>";
if (i % 2 != 0) {
middleEndpoints.innerHTML +=
"<div class='row'>"+
"<div class='col-sm-1 align-self-center'></div>"+
"<p style='margin-bottom: 0;'>" + myArr[i] + "</p>"+
"</div>";
}
middleEndpoints.innerHTML +=
"<div class='col-sm-10 align-self-center'>"+
"<p class='midLine'>⇅</p>"+
"</div>"+
"</div>";
}
clicks += 1;
}
});
也许是这个？
document.getElementById("arrowLink").addEventListener("click", function() {
if (clicks >= 1) return
clicks++;
const html = [];
displayArr1.forEach((item, i) => {
html.push(`<div class='d-flex justify-content-center'>
<div class='p-2'>
<p>Abc</p>
</div>`);
if (i % 2) {
html.push(`<div class='row'>
<div class='col-sm-1 align-self-center'>
<p style='margin-bottom: 0;'>${myArr[i]}</p>
</div>`);
}
html.push(`<div class='col-sm-10 align-self-center'>
<p class='midLine'>⇅</p>
</div>
</div>`)
});
middleEndpoints.innerHTML=html.join("");
clicks += 1;
});
