Javascript 使用复选框选择指定表格样式更改

Javascript 使用复选框选择指定表格样式更改,javascript,html,css,html-table,Javascript,Html,Css,Html Table,是否有一种方法可以通过选中复选框将选定行的样式更改为任何样式。当选择“单击我”按钮时,所选行的样式将更改。我可以删除行(使用另一个按钮),但不能更改所选行的样式。行将被删除或样式将更改 有人可以帮助我,或告诉我在正确的方向的造型问题 HTML: JS删除一行 function delBoxes() { let boxes = document.getElementsByClassName('chk'); for (let i = 0; i < boxes.lengt

是否有一种方法可以通过选中复选框将选定行的样式更改为任何样式。当选择“单击我”按钮时,所选行的样式将更改。我可以删除行(使用另一个按钮),但不能更改所选行的样式。行将被删除或样式将更改

有人可以帮助我,或告诉我在正确的方向的造型问题

HTML:






JS删除一行

function delBoxes() {
   let boxes = document.getElementsByClassName('chk');
   for (let i = 0; i < boxes.length; i++) {
     let box = boxes[i];
     if (box.checked) {
       let rowTag = box.parentNode.parentNode;
       let tableTag = box.parentNode.parentNode.parentNode;
       tableTag.removeChild(rowTag);
     }
   }
}

document.getElementById("deleteButton").addEventListener("click", delBoxes);
函数delbox(){
let box=document.getElementsByClassName('chk');
for(设i=0;i
我对HTML做了一些更改,为按钮和行添加了ID。此外,我还在复选框中添加了数据集,以便您知道要执行任务的行(更改样式或删除)

函数delbox(){
let box=document.getElementsByClassName('chk');
对于(设i=box.length-1;i>=0;i--){
设box=box[i];
如果(复选框){
让rowTag=document.getElementById(box.dataset.row);
rowTag.parentNode.removeChild(rowTag);
}
}
}
函数样式(){
let box=document.getElementsByClassName('chk');
对于(设i=box.length-1;i>=0;i--){
设box=box[i];
如果(复选框){
让rowTag=document.getElementById(box.dataset.row);
rowTag.style.backgroundColor=“红色”;
}
}
}
document.getElementById(“deleteButton”).addEventListener(“单击”,Delbox);
document.getElementById(“样式按钮”).addEventListener(“单击”,样式)


您认为样式改变是什么意思?您共享的代码中没有样式更改逻辑。他的意思是将样式更改为任何样式(只更改颜色应该可以),您可以在表元素上切换一个类
function delBoxes() {
   let boxes = document.getElementsByClassName('chk');
   for (let i = 0; i < boxes.length; i++) {
     let box = boxes[i];
     if (box.checked) {
       let rowTag = box.parentNode.parentNode;
       let tableTag = box.parentNode.parentNode.parentNode;
       tableTag.removeChild(rowTag);
     }
   }
}

document.getElementById("deleteButton").addEventListener("click", delBoxes);