js单击第一个按钮,将左侧选中的所有选项移动到右边
时间: 2023-12-10 09:04:08 浏览: 31
假设左边的选项是一组带有相同类名的复选框,可以使用以下代码将选中的复选框移动到右边:
```javascript
// 获取左边的容器和右边的容器
var leftContainer = document.querySelector('.left-container');
var rightContainer = document.querySelector('.right-container');
// 获取所有的复选框
var checkboxes = leftContainer.querySelectorAll('input[type="checkbox"]');
// 获取第一个按钮
var button = document.querySelector('button:first-of-type');
// 给按钮添加点击事件处理程序
button.addEventListener('click', function() {
// 遍历所有的复选框
for (var i = 0; i < checkboxes.length; i++) {
// 如果当前复选框被选中
if (checkboxes[i].checked) {
// 将复选框从左边容器中移除
leftContainer.removeChild(checkboxes[i].parentNode);
// 将复选框添加到右边容器中
rightContainer.appendChild(checkboxes[i].parentNode);
}
}
});
```
在上面的代码中,我们首先获取左边和右边的容器,以及所有的复选框。然后,我们在第一个按钮上添加一个点击事件监听器。当按钮被点击时,我们遍历所有的复选框,如果当前复选框被选中,我们就将其从左边容器中移除,并将其添加到右边容器中。