sample: toggle group images by click

by sii_side

HTML

<img id="A" alt="A" onclick="changeIcon(true);">
<img id="B" alt="B" onclick="changeIcon(false);">
<img id="C" alt="C" onclick="changeIcon(true);">
<img id="D" alt="D" onclick="changeIcon(false);">

JavaScript

function changeIcon(flag) {
	//例としてalt属性を操作しています
  
	//一旦全部OFF
  document.querySelector("#A").alt = "imgA_off.png";
  document.querySelector("#B").alt = "imgB_off.png";
  document.querySelector("#C").alt = "imgC_off.png";
  document.querySelector("#D").alt = "imgD_off.png";

	//フラグ(引数)に応じて必要なものだけON
	if(flag) {
  	document.querySelector("#A").alt = "imgA_on.png";
  	document.querySelector("#C").alt = "imgC_on.png";
  } else {
  	document.querySelector("#B").alt = "imgB_on.png";
  	document.querySelector("#D").alt = "imgD_on.png";
  }
}