DOM2JSON
Sunny-117 opened this issue · comments
{
tag: 'DIV',
children: [
{
tag: 'SPAN',
children: [
{ tag: 'A', children: [] }
]
},
{
tag: 'SPAN',
children: [
{ tag: 'A', children: [] },
{ tag: 'A', children: [] }
]
}
]
}
function dom2Json(domtree) {
let obj = {};
obj.name = domtree.tagName;
obj.children = [];
domtree.childNodes.forEach((child) => obj.children.push(dom2Json(child)));
return obj;
}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<div class="box">
<p class="p">hello world</p>
<div class="person">
<span class="name">DOM2JSON</span>
<span class="age">100</span>
</div>
</div>
<script>
function DOM2JSON(domTree){
if(!domTree) return;
let rootObj = {
tagName: domTree.tagName,
children: []
}
const children = domTree.children
if(children){
Array.from(children).forEach((element, i) => {
rootObj.children[i] = DOM2JSON(element)
})
}
return rootObj
}
console.log(DOM2JSON(document.querySelector('.box')))
</script>
</body>
</html>
function DOMtoJSON(node) {
const obj = {
tag: node.tagName.toLowerCase(),
children: [],
};
for (let i = 0; i < node.children.length; i++) {
obj.children.push(DOMtoJSON(node.children[i]));
}
return obj;
}
function dom2json(domtree) {
let obj = {};
obj.tag = domtree.tagName.toLowerCase();
obj.children = [];
domtree.children.forEach((item) => {
obj.children.push(dom2json(item));
});
return obj;
}