原生js操作checkbox用document.getElementById实现

原生JS操作checkbox用document.getElementById实现的步骤如下：

1.在HTML页面中添加checkbox元素：

<input type="checkbox" id="myCheckbox">My Checkbox</input>

2.在JS文件中使用document.getElementById()方法获取checkbox元素：

var checkbox = document.getElementById("myCheckbox");

3.使用checkbox元素的checked属性来获取/设置checkbox是否被选中：

// 获取checkbox是否被选中
var isChecked = checkbox.checked;

// 设置checkbox为选中状态
checkbox.checked = true;

示例1：实现通过点击按钮来切换checkbox选中状态

<input type="checkbox" id="myCheckbox">My Checkbox</input>
<button onclick="toggleCheckbox()">Toggle Checkbox</button>

<script>
function toggleCheckbox() {
  var checkbox = document.getElementById("myCheckbox");
  checkbox.checked = !checkbox.checked;
}
</script>

示例2：实现根据checkbox选中状态来显示/隐藏元素

<input type="checkbox" id="myCheckbox">My Checkbox</input>
<div id="myDiv" style="display:none">I am hidden</div>

<script>
var checkbox = document.getElementById("myCheckbox");
var myDiv = document.getElementById("myDiv");

checkbox.addEventListener("click", function() {
  if (checkbox.checked) {
    myDiv.style.display = "block";
  } else {
    myDiv.style.display = "none";
  }
});
</script>

以上就是原生JS操作checkbox的完整攻略。