如何添加多个文本框来替换页面上的文本

<input type="text" id="textbox1">
<input type="text" id="textbox2">
<input type="text" id="textbox3">

<button onclick="replaceText()">替换文本</button>

<script>
function replaceText() {
  var textbox1Value = document.getElementById("textbox1").value;
  var textbox2Value = document.getElementById("textbox2").value;
  var textbox3Value = document.getElementById("textbox3").value;

  // 替换页面上的文本
  document.getElementById("targetElement1").innerText = textbox1Value;
  document.getElementById("targetElement2").innerText = textbox2Value;
  document.getElementById("targetElement3").innerText = textbox3Value;
}
</script>

<input type="text" id="textbox1" class="textbox">
<input type="text" id="textbox2" class="textbox">
<input type="text" id="textbox3" class="textbox">

<style>
.textbox {
  width: 200px;
  height: 30px;
  border: 1px solid #ccc;
  padding: 5px;
}
</style>