将 jquery 转换为 javascript 以突出显示单选按钮/复选框的父 div

Question

以下代码将 class 添加到复选框/单选按钮的父级，以突出显示单选按钮以及 label。

这是我需要将其转换为 JavaScript 的 jQuery 代码。我是 jQuery 和 JavaScript 的新手。

任何指针将不胜感激！

$('form input[type=checkbox]').click ( function(){
    var $this = $(this);
    if (this.checked)
    {   $(this).parent().addClass("highlight"); }
    else
    { $(this).parent().removeClass("highlight");    }
})

$('form input[type=radio]').change(function(){
    var $this = $(this);
    $this.parent().parent().find('label.highlight').removeClass('highlight');
    $(this).parent().addClass("highlight");
});

Answer 1

我想我找到了解决方案。

但我确信这不是最有效的代码，所以如果你能想到更好的选择，请告诉我。

   function checkBox(obj) {
   object=obj;

   if (object.checked){
    object.parentElement.classList.add("highLight1");
   }
   else {
    object.parentElement.classList.remove("highLight1");
   }
   }


   function highlight(obj) {
   object = obj;

   var radios = document.getElementsByName("A1");

   for(var i = 0; i < radios.length; i++) {
     if(radios[i].checked){
    radios[i].parentElement.classList.add("highLight1");
    }
    else {
        radios[i].parentElement.classList.remove("highLight1");
    }
   }
   }