javascript打印dom树

最新推荐文章于 2024-09-29 15:01:26 发布

原创最新推荐文章于 2024-09-29 15:01:26 发布 · 3.7k 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #dom

javascript 专栏收录该内容

7 篇文章

订阅专栏

本文介绍了一个函数，用于将DOM元素递归渲染到控制台，并测量整个过程的时间成本。通过此方法，可以了解DOM操作的性能影响。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

复制粘贴下面的代码到控制台：

function render(node, splits) {
		
		splits.tag += '|----';
		console.log(splits.tag + node.tagName);

		var children = node.children;
		if (!children) return;
		for (var i = 0, len = children.length; i < len; i++) {
			var child = children[i];
			var _tag = splits.tag;
			render(child, splits);
			splits.tag = _tag;
		}
}
var splits = {tag:''}
var start = (new Date()).getTime();
render(document.body, splits);
var end = (new Date()).getTime();
console.log('Cost: ' + (end - start) + 'ms');