Алгоритмдер (анимация)Браузеріңізде жұмыс істейдіТексерілген күні: 2026 ж. 1 қазан

DOM Traversal: Depth-First Search: анимация

DOM Traversal: Depth-First Search: анимация. Фронтенд үшін анимациялы алгоритмдер: сұрыптау, іздеу, debounce және throttle, event loop, виртуалды DOM, кэш, trie және жол іздеу. Браузеріңізде жылдам, құпия және оңай.

Жергіліктіәдепкіде құпияЖылдамтіркелу қажет емес

Төмендегі құралдың батырмалары мен мәтіндері әзірге ағылшын тілінде.

Browser and DOMTime: O(n)Space: O(h) for tree height h

Find the first element named

html

head

title

body

header

nav

main

section

button

footer

Call stack (path from the root)

empty

Visit order

empty

Step 1 / 34

Depth-first search goes as deep as possible down one branch before trying the next, looking for <button>. It is how querySelector walks the DOM.

JavaScript

1function dfs(node, target, visit) {
2  visit(node);
3  if (node.tag === target) return node;
4  for (const child of node.children) {
5    const found = dfs(child, target, visit);
6    if (found) return found;
7  }
8  return null;
9}

Tip: use the arrow keys to step and the space bar to play or pause.

Loading animation...