$root & $el

$root

$root is a magic property that can be used to retrieve the root element of any Alpine component. In other words the closest element up the DOM tree that contains x-data.

<div x-data data-message="Hello World!">
    <button @click="alert($root.dataset.message)">Say Hi</button>
</div>

$el

$el is a magic property that can be used to retrieve the current DOM node.

<button @click="$el.innerHTML = 'Hello World!'">
  Replace me with "Hello World!"
</button>