如何在不同页面上点击多个不同属性的按钮(同名)？

<button id="button1">按钮1</button>
<button id="button2">按钮2</button>

#button1 {
  /* 样式1 */
}

#button2 {
  /* 样式2 */
}

var button1 = document.getElementById("button1");
button1.addEventListener("click", function() {
  // 按钮1的点击事件处理程序
});

var button2 = document.getElementById("button2");
button2.addEventListener("click", function() {
  // 按钮2的点击事件处理程序
});

// 按钮组件
const Button = ({ id, onClick }) => {
  return <button id={id} onClick={onClick}>按钮{id}</button>;
}

// 页面组件
const Page = () => {
  const handleButtonClick = (id) => {
    // 处理特定按钮的点击事件
  }

  return (
    <div>
      <Button id="button1" onClick={() => handleButtonClick("button1")} />
      <Button id="button2" onClick={() => handleButtonClick("button2")} />
    </div>
  );
}

<button class="button">按钮1</button>
<button class="button">按钮2</button>

$(".button").on("click", function() {
  var buttonId = $(this).attr("id");
  // 处理特定按钮的点击事件
});