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>