<p id="hide">點我隱藏</p>
<p id="show">點我顯示</p>
<p id="test">是 Ray 不是 Array</p>
const $ = (selector) => {
  const element = document.querySelector(selector);

  element.on = (event, callback) => {
    element.addEventListener(event, callback);
  };

  element.hide = () => {
    element.style.display = 'none';
  };

  element.show = () => {
    element.style.display = 'block';
  };

  return element;
}

$('#hide').on('click', () => {
  $('#test').hide();
})

$('#show').on('click', () => {
  $('#test').show();
})

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.