01.复选框全选

全选结构一(上级的同级的子级类型)



全选结构二(同级类型)


全选结构三(表格类型)

全选功能说明:
html:
红色字体部分为自定义属性且必填,input请用label包含
结构一[上级同级的下级]:
<div>
  <div dataType="parent">
    <label dataType="checkbox1"><input type="checkbox">全选</label>
  </div>
  <div dataType="siblings">
    <label><input type="checkbox">checkbox1</label>
    <label><input type="checkbox">checkbox2</label>
    <label><input type="checkbox">checkbox3</label>
  </div>
</div>
结构二[同级]:
<div>
  <div>
    <label datatype="checkbox2"><input type="checkbox">全选</label>
    <label><input type="checkbox">checkbox1</label>
    <label><input type="checkbox">checkbox2</label>
    <label><input type="checkbox">checkbox3</label>
  </div>
</div>
结构三[表格]:
<table>
  <thead>
    <tr>
      <td><label datatype="table"><input type="checkbox">全选</label></td>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td><label><input type="checkbox">checkbox1</label></td>
    </tr>
    <tr>
      <td><label><input type="checkbox">checkbox1</label></td>
    </tr>
    <tr>
      <td><label><input type="checkbox">checkbox1</label></td>
    </tr>
  </tbody>
</table>