Javascript 为什么我得到空白的输入值？

JavaScript代码：

var inputText = document.getElementById('input').value,
    output = document.getElementById('output'),
    convertBtn = document.getElementById('convertBtn');

convertBtn.addEventListener('click',convert);

function convert(event){
    event.preventDefault()
    inputText = String(inputText);
    let binary = '';
    for(let n of inputText){
        binary += n.charCodeAt(0).toString(2) + ' ';
        console.log(binary)
      }

    output.innerText = binary;
    console.log(inputText)
}

这里，输入值不在第1行。它在控制台上返回为空。。。 此处的HTML代码：

<h2 class="text-center bg-secondary m-5 p-3 font-weight-bold1">Text To Binary</h2>
<form class="text-center m-5"></form>
    <div class="input-group mb-3">
        <div class="input-group-prepend">
          <span class="input-group-text" id="basic-addon1">Your Text :</span>
        </div>
        <input type="text" class="form-control" placeholder="Type here..." id="input">
      </div>
      <button class="btn btn-danger" id="convertBtn">Convert</button>
      <div class="input-group mb-3">
        <div class="input-group-prepend">
          <span class="input-group-text" id="basic-addon1">Binary :</span>
        </div>
        <h3 class="text-red" id="output"></h3>
      </div>
</form>

文本到二进制
你的文字：
转换
二元的：

请共享代码。您正在读取页面加载时的值，此时输入可能仍然为空。获取

convert

函数中的值。您需要读取

函数convert（event）{

中的值，因为

inputText=document.getElementById（'input'）。值不会随输入的每次更改而更改
function convert(event){
    var inputText = document.getElementById('input').value; 
    event.preventDefault()
    inputText = String(inputText);
    let binary = '';
    for(let n of inputText){
        binary += n.charCodeAt(0).toString(2) + ' ';
        console.log(binary)
      }

    output.innerText = binary;
    console.log(inputText)
}