高级前端必会设计模式之组合模式

前端JavaScript设计模式-组合模式：

组合模式目的在于生成树形结构，表示"整体"与"部分"关系，让整体和部分都具有一致的操作方式

例如页面中有下面一段代码段

<div id="dom" class="dom-class">
  <p>123</p>
  <p>abc</p>
</div>

通过js将上面的DOM结构转换成对象格式进行描述，并且保留DOM原有的操作方式

let dom= {
  tag:'div',
  attr:{
    id:'div',
    class:'dom-class'
  },
  children:[
    {
      tag:'p',
      attr:{},
      children:['123']
    },
    {
      tag:'p',
      attr:{},
      children:['abc']
    }
  ]
}