问如何比较e.currentTarget和e.Target？

EN

document.querySelector('#test').addEventListener('click', (e) => {
  if(e.target === e.currentTarget) console.log('yes');
});

div#test {
  padding: 20px;
  background-color: red;
}

div#test p {
  background-color: blue;
}

<div id="test">
  Try clicking here and then the P
  <p id="test2">Test</p>
</div>

// Reference <form>
const current = document.forms[0];
// Register <form> to click, input, and change events
current.onclick = current.oninput = current.onchange = manageEvt;

// Callback function passes Event Object (e)
function manageEvt(e) {
  // This is <form> - tag registered to event(s)
  const cur = e.currentTarget;
  // This is the tag that is event origin (clicked, changed, etc.)
  const tgt = e.target;
  // This is the event type (click, input, and change)
  const evt = e.type;
  /*
  "this" is currentTarget (<form>) 
  .elements is all form controls of "this"
  .out is the <output> id
  */
  const out = this.elements.out;

  // Clear <output>
  out.value = '';
  /*
  if clicked, inputted, or changed tag is NOT <form>...
  ...display message...
  Otherwise if only the <form> is clicked display another message.
  */
  if (tgt !== cur) {
    out.value = '#' + tgt.id + ' is Event.target for ' + evt.toUpperCase() + ' EVENT ------------------value: ' + tgt.value;

  }
  if (tgt === cur) {
    out.value = '#' + tgt.id + ' is Event.target and Event.currentTarget for ' + evt.toUpperCase() + ' EVENT';

  } 
}

form {
  border: 3px dashed red;
  padding: 30px;
}

<form id='CURRENT'>
  <button id='BUTTON' name='tgt' type='button' value="button">CLICK EVENT</button><br>
  <input id='TEXT' name='tgt' type='text' placeholder='INPUT EVENT'><br>
  <input id='RADIOA' name='tgt' type='radio' value="A"> A
  <input id='RADIOB' name='tgt' type='radio' value="B"> B<br>

  <output id='out'></output>
</form>