How to use dom-walk - 3 common examples

initStages() {
    walk(this.target, node => {
      if (node.nodeType !== 1) return
      const stageId = node.getAttribute('data-scroll-stage-id')
      if (stageId) {
        const stageConfig = getObjectFromArrById(this.config.stages, stageId)
        if (!stageConfig) {
          throw new Error(`
            Missing scrolling config for stage id: ${ stageId }
          `)
        }
        node.style.transition = `
          ${ this.config.stageSwitchTransition }ms ${ this.config.stageSwitchEasing } ${ this.config.stageSwitchDelay }ms
        `
        this.stages.push({
          node,
          stageConfig: merge({}, [defaultStageConfig, stageConfig]),
          id: stageId,

static attachNodeToItems(stage) {
    walk(stage.node, node => {
      if (node.nodeType !== 1) return
      const itemId = node.getAttribute('data-scroll-item-id')
      if (itemId) {
        const itemConfig = getObjectFromArrById(stage.stageConfig.items, itemId)
        if (!itemConfig) throw new Error(`Missing scrolling config for item id: ${ itemId }`)
        itemConfig.node = node
      }
    })
  }

constructor(target, config) {
    if (typeof target === 'string') {
      target = document.querySelector(target)
    }
    if (!target || target.nodeType !== 1) {
      throw new Error('Cannot find target dom to apply hover effects')
    }
    config = merge({}, [defaultConfig, config])

    this.target = target
    this.config = config
    this.layers = []

    walk(target, node => {
      if (node.nodeType !== 1) return
      const layer = node.getAttribute('data-hover-layer')
      if (layer) {
        const configMultiple = config.layers[Number(layer)].multiple
        if (!configMultiple) throw new Error(`Missing translate config for ${ layer }`)
        this.layers.push(merge({
          node,
          multiple: configMultiple === undefined ? 0.2 : configMultiple,
          reverseTranslate: !!config.layers[Number(layer)].reverseTranslate
        }, [this.constructor.getInitialTransformMatrix(node)]))
      }
    })
    this.target.style.transform = `perspective(${ this.config.perspective }px)`
    this.addEventHandlers()
  }