javascript两个数组作对比

Question

场景：如var a = [11,33,55,77];

 另一数组b是a的子集，var b = [33,55]
 a数组会用<input type="checkout"/>标签在html页面渲染出来，并勾选数组b的值
 请问如何实现？谢谢

Answer 1

var a = [11,33,55,77],
    b = [33,55],
    html = '';

for(var i = 0; i < a.length; i++) {
    var item = a[i];
    html += '<input type="checkbox" name="demo_checkbox" value="' + item + '" id="demo_checkbox_' + item + '" ' + (b.indexOf(item) > -1 ? 'checked' : '') + '><label>' + item + '</label>';
}

document.getElementById('check-list').innerHTML = html;

演示地址：https://jsbin.com/yadifimeme/...

Answer 2

如果用vue那就非常好的实现

<div id='test'>
<input v-for='value in a' :value='value' v-model='b' type="checkbox"/ >
</div>


<script>
    new Vue({
        el:"#test",
        data:{
           a:[11,33,55,77],
           b:[33,55]
        }
    })
</script>

点击看在线例子

Answer 3

indexOf 方法判断存在。

例子：https://jsbin.com/xawoxiroco/...

var a = Array('a','b','c');
var b = Array('b');
var html = '';

for(var i = 0; i < a.length; i++) {
  if(b.indexOf(a[i])>-1){
    html += "<input type='checkbox' name='"+a[i]+"' value='"+a[i]+"' checked>";
  }else {
    html += "<input type='checkbox' name='"+a[i]+"' value='"+a[i]+"'";
  }
  html += "<label for='"+a[i]+"'>"+a[i]+"</label>"
}

document.getElementById('main').innerHTML = html;

Answer 4

var val = $(this).val()
for (var i = 0; i < b.length; i++) {
  if (val === b[i]) {
    b.splice(i, 1)
    break
  } else if (i === b.length - 1) {
    b.push(val)
  }
}