input[type=“checkbox“]:checked实现改变checkbox的样式，js实现点击确认同意后实现勾选checkbox实现方法

问题一
怎么实现用CSS改变input 中的type=“checkbox” 属性的样式？
实现方法
复制以下CSS

input[type="checkbox"] {
  width: 20px;
  height: 20px;
  background-color: #fff;
  -webkit-appearance: none;
  border: 1px solid #c9c9c9;
  border-radius: 2px;
  outline: none;
}
input[type="checkbox"]:checked {
  background: url(static/picture/dh.png) no-repeat center;
  background-size: 100% 100%;
}

问题二
js怎么实现点击确认同意后，实现checkbox的勾选样式？
首先input是这样的

<input type="checkbox" id="checkbox1" class=""/ >
<label style="margin-top: 5px;" for="checkbox1">本人已阅读并同意</label>

方法
需要提前写好checkbox的CSS的样式类，
然后复制以下js代码，自行改变里面的点击事件id或class

$(document).ready(function(e) {
    $("点击确定的id").click(function(e) {
        if( $("#checkbox的id").hasClass("样式类名") ){
			true;
        }else{
			$("#checkbox的id").addClass("样式类名"); 
        }
    });
});

希望可以帮助到有此类问题的你，加油加油！
写作不易，如果有帮助多多支持点个赞，以上实现方法为个人思路，大佬勿喷哈。
如果大佬有更好的实现方法还请多多指教