snippets

match elements from parent

• The .prop() method maps to a search for the given key in a dataset using .closest().
• Sending and receiving elements can use this to determine if they are inside the same parent element.
• Doing a comparison in the signal function provides a way for a single function to work with a single set of sender/receiver elements regardless of the number on the page.

html

<div data-key="alfa">
  <div data-r="snippetSignal">waiting</div>
  <button data-s="snippetSignal">Send Alfa</button>
</div>

<div data-key="bravo">
  <div data-r="snippetSignal">waiting</div>
  <button data-s="snippetSignal">Send Bravo</button>
</div>

<div data-key="charlie">
  <div data-r="snippetSignal">waiting</div>
  <button data-s="snippetSignal">Send Charlie</button>
</div>

javascript

export const b = {};

export function snippetSignal(_, sender, el) {
  if (sender.prop("key") === el.prop("key")) {
    el.innerHTML = b.time();
  }
}