SOURCE

console 命令行工具 X clear

                    
>
console
const dom = document.getElementsByClassName('container')[0]
function dom2Json(dom) {
    let res = {}
    let tag = dom.tagName,
        attrs = dom.attributes
    let attrObj = {}
    for (let attr of attrs) {
        let name = attr.name,
            value = attr.value
        attrObj[name] = value
    }
    res['tag'] = tag
    res['attributes'] = attrObj
    let children =[...dom.children]
    if (children.length) {
        res['children'] = []
        for (let child of children) {
            res['children'].push(dom2Json(child))
        }
    }
    return res
}
let tree = dom2Json(dom)
console.log("tree", tree)
<div class="container" id="1">
  <div class="header-container">
    <div class="header">
      <a href="">a标签</a>
      <a href="">a标签</a>
      <a href="">a标签</a>
    </div>
  </div>
  <div class="content-container">
    <img src="" alt="">
    <div class="content">
      <span>搜索</span>
      <input type="text">
      <span>话筒</span>
    </div>
    <div class="btns">
      <button>按钮1</button>
      <button>按钮2</button>
    </div>
  </div>
</div>