就举个例子来说，有很多任务，每个没完成的任务后面，都有一个勾选框，要怎样把任务的样式改变（比如字变成红色），当勾选完成之后呢……

不使用任何js的话需要把前面的内容在html结构里面放在chekbox后面。再定位(浮动)到前面。就可以用，＋号，兄弟选择器选中了。

怎样改变CheckBox前面内容的样式，当被选中之后

看了你的评论，沙发应该休息了。

使用他的代码根据你的需求改动的。

注：代码来自沙发，根据你的需求改动了一下。

改变label的样式，只要修改一下 css 的red样式（也可以换个名字，js中同步换）

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <script src="https://cdn.bootcss.com/jquery/2.2.0/jquery.min.js"></script>
    <style>
        .finished {

            color: red;
        }
    </style>
</head>

<body>
    <div id="list">

    </div>
</body>
<script>
    var issues = 'xxxx', begins = '2017', deadline = '2018';
    var div = document.createElement("div");
    var addtask = document.createElement("label");
    addtask.innerHTML = issues + "   form  " + begins + "   to  " + deadline;
    addtask.setAttribute("for", " ");
    var taskbox = document.getElementById("list");
    //taskbox.appendChild(addtask);//添加任务

    var taskcheck = document.createElement("input");
    taskcheck.type = "checkbox";
    taskcheck.setAttribute("class", "taskboxcheck");
    //taskcheck.name = "check";
    div.appendChild(addtask);
    div.appendChild(taskcheck);

    taskbox.appendChild(div);

    $(document).on('click', '.taskboxcheck', function () {
        console.log(1);
        if ($(this).is(':checked')) {
            $(this).prev().addClass('finished')
        }
        else {
            $(this).prev().removeClass('finished')
        }
    })

</script>

</html>

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script> </head> <style> .red{ color:red } </style> <body style="width:100%;height:500px"> <div class="boxs"> <div> <input type="checkbox" class="box">1111 </div> <div> <input type="checkbox" class="box">2222 </div> <div> <input type="checkbox" class="box">3333 </div> </div> <script> $('.boxs').on('click','.box',function(){ if($(this).is(':checked')){ $(this).parent().addClass('red') }else{ $(this).parent().removeClass('red') } }) </script> </body> </html>

怎样改变CheckBox前面内容的样式，当被选中之后

你尚未登录，登录后可以

js 如何将Key属性相同的放在同一个数组？

Next.js做纯前端是否可行？

如何实现一个深拷贝函数？

git提交记录问题？

body :first-child(不是body:first-child，中间有空格)伪类选择器到底选中了什么元素？

怎么获取动态弹出对话框的模拟单击？

如何实现类似豆包的AI改写框跟随内容滚动效果？