如何在回收器视图上设置单击侦听器并打开静态页面并从json url获取内容

<button id="myButton">点击我</button>

document.getElementById("myButton").addEventListener("click", function() {
  // 在这里编写获取 JSON 内容的代码
});

fetch("http://example.com/data.json")
  .then(response => response.json())
  .then(data => {
    // 在这里处理获取到的 JSON 数据
  })
  .catch(error => {
    console.error("获取 JSON 数据时发生错误：", error);
  });

document.getElementById("myButton").addEventListener("click", function() {
  fetch("http://example.com/data.json")
    .then(response => response.json())
    .then(data => {
      // 将获取到的 JSON 数据渲染到页面上的某个元素中
      document.getElementById("result").textContent = JSON.stringify(data);
    })
    .catch(error => {
      console.error("获取 JSON 数据时发生错误：", error);
    });
});

<div id="result"></div>