使用JavaScript来实现将HTML DOM Input Checkbox改为Input button
时间: 2024-05-05 21:17:42 浏览: 116
利用JavaScript更改input中radio和checkbox样式
可以使用以下JavaScript代码来实现:
```javascript
// 获取所有的复选框
var checkboxes = document.querySelectorAll('input[type="checkbox"]');
// 遍历复选框
for (var i = 0; i < checkboxes.length; i++) {
// 创建一个新的按钮元素
var button = document.createElement('input');
button.type = 'button';
button.value = checkboxes[i].value;
// 将按钮元素替换为复选框元素
checkboxes[i].parentNode.replaceChild(button, checkboxes[i]);
}
```
这段代码首先通过`querySelectorAll`方法获取所有的`input`元素,并筛选出类型为`checkbox`的元素。然后使用`createElement`方法创建一个新的`input`元素,类型为`button`,并将其`value`属性设置为原来复选框的`value`属性。最后,使用`replaceChild`方法将复选框元素替换为新创建的按钮元素。
阅读全文