javascript - 在 p 标签上使用事件监听器

Question

当我点击任一 p 标签 时，我无法更改 h1 标签。我在遍历 p 标签、提取值并使用该数据值更改标题时遇到问题。到目前为止，我只收到错误 Cannot read property value of undefined。

window.addEventListener('load', function() {
  'use strict';

  const p_array = document.getElementsByTagName("p");
  const count = p_array.length;

  //loop through a list of elements.
  for (let i = 0; i < count; i++) {

    const p = p_array[i];

    p.addEventListener("click", function() {

      const tag = p.getElementsByTagName('p');

      document.getElementById("title").innerHTML = tag.dataset.value;

    })
  }
});

<h1 id="title">Title</h1>
<p data-value="One">Click to change title to One</p>
<p data-value="Two">Click to change title to Two</p>
<p data-value="Three">Click to change title to Three</p>

Answer 1

window.addEventListener('load', function() {
  'use strict';

  const p_array = document.getElementsByTagName("p");
  const count = p_array.length;

  //loop through a list of elements.
  for (let i = 0; i < count; i++) {

    const p = p_array[i];

    p.addEventListener("click", function() {

      //const tag = p.getElementsByTagName('p');

      document.getElementById("title").innerHTML = p.dataset.value;

    })
  }
});

<h1 id="title">Title</h1>
<p data-value="One">Click to change title to One</p>
<p data-value="Two">Click to change title to Two</p>
<p data-value="Three">Click to change title to Three</p>