checkbox ฝังค่า value ไว้ 2 ค่าได้ไหมครับ ระหวัง เช็คกับไม่เช็ค

<input type="checkbox" name="mychk" id="mychk" value="myvalue"
    data-status="off" 
    data-icon="myicon"
    onChange="doMyfunc()" >
<label for="mychk">  
test      
</label>
<script>
function doMyfunc(){
	// อ้างอิง HTML DOM Object ที่ต้องการจัดการ 
	const obj = document.querySelector("#mychk");
	var _get_status = obj.dataset.status;  // ดึงค่าจาก data attribute
	var _get_icon = obj.dataset.icon;  // ดึงค่าจาก data attribute
	var chechkedStatus = obj.checked; // เก็บสถานะการ checked หรือติ้กเลือก
	alert(_get_status+"\r\n"+_get_icon+"\r\n"+chechkedStatus); // ทดสอบแสดงค่า
	obj.dataset.status = (chechkedStatus==true)?"on":"off"; // กำหนดค่าตามเงื่อนไข
	// วิธีการกำหนดค่าของ data attribute จะใช้รูปแบบ
	// obj.dataset.status = ค่าที่ต้องการ;
	var _get_status = obj.dataset.status;  // ดึงค่าจาก data attribute ใหม่
	alert(_get_status+"\r\n"+_get_icon+"\r\n"+chechkedStatus); // ทดสอบแสดงค่า
}
</script>

onChange="doMyfunc(this)"  // this ก็คือตัว checkbox นั้นเอง

function doMyfunc(obj){
    // เราสามารถ อ้างอิง Object ผ่านตัวแปร obj ได้เลย
}

const obj = document.getElementById("mychk");  // อ้างอิงผ่าน id
const obj = document.querySelector("[data-status]"); // อ้างอิงผาน data attribute

<style>
#mychk[data-status="off"]+label{
  color:red;
}
#mychk[data-status="on"]+label{
  color:green;
}
</style>

<style>
#mychk[data-status="off"]::after{
  color:red;      
  content:attr(data-status);
  margin-left:20px;
  display:inline-block;
}
#mychk[data-status="on"]::after{
  color:green;
  content:attr(data-status);
  margin-left:20px;
  display:inline-block;
}
</style> 
<input type="checkbox" name="mychk" id="mychk" value="myvalue"
    data-status="off" 
    data-icon="myicon"
    onChange="doMyfunc()" >
<script>
function doMyfunc(){
	const obj = document.querySelector("[data-status]");
	var _get_status = obj.dataset.status;  // ดึงค่าจาก data attribute
	var chechkedStatus = obj.checked; // เก็บสถานะการ checked หรือติ้กเลือก
	obj.dataset.status = (chechkedStatus==true)?"on":"off"; // กำหนดค่าตามเงื่อนไข
}
</script>

<style>
#mychk[data-status="off"]::after{
  color:red;      
  content:attr(data-status);
  margin-left:20px;
}
#mychk[data-status="on"]::after{
  color:green;
  content:attr(data-status);
  margin-left:20px;
}
</style> 
<input type="checkbox" name="mychk" id="mychk" value="myvalue"
    data-status="off" 
    data-icon="myicon" >
<script src="https://unpkg.com/[email protected]/dist/jquery.min.js"></script>
<script type="text/javascript">
$(function(){
     $("#mychk").on("change",function(){
		 var _get_status = $(this).data("status");  // ดึงค่าจาก data attribute
		 var chechkedStatus = ($(this).prop("checked")==true)?"on":"off";
		 $(this).data("status",chechkedStatus); // กำหนดค่า data attribute
	 });
});
</script>