Bootstrap 5环境下如何同步输入框内容至页面指定区域

需求：基于Bootstrap 5开发，不依赖jQuery，实现侧边栏设置区域的输入框内容实时同步显示在页面主体的指定区域（此前输入框内容无任何同步效果）。

已实现的解决方案代码如下：

HTML 代码 #

<h1 id="output">Text Goes Here</h1>

<div>
  <span>Centre ID No.</span>
   <input type="text" id="centreNumber"/>
</div>

JavaScript 代码 #

const output = document.getElementById("output");

document.getElementById("centreNumber").addEventListener("input", (e) => {
  output.textContent = e.target.value;
});

内容的提问来源于stack exchange，提问作者Scott Wilks