Javascript事件代理

  <body>

    <section class="preview">
    </section>

    <div class="button-bar">
      <button data-color="red">Red</button>
      <button data-color="yellow">Yellow</button>
      <button data-color="green">Green</button>
      <button data-color="purple">Purple</button>
    </div>

  </body>

  <script>

  let buttonBar = document.querySelector('.button-bar');

  // Add your code here

  buttonBar.addEventListener('click', function(e) {
    if (e.target && e.target.nodeName == 'BUTTON') {
      buttonBar.style.backgroundColor = e.target.dataset.color;
    }

  });
  </script>
阅读量: 640
发布于:
修改于: