如何启动光标在占位符文本上居中反应本机？

<input type="text" placeholder="占位符文本">

input[type="text"] {
  text-align: center;
}

var input = document.querySelector('input[type="text"]');
input.addEventListener('input', function() {
  var placeholderLength = input.placeholder.length;
  var inputLength = input.value.length;
  var cursorPosition = Math.floor((placeholderLength - inputLength) / 2);
  input.setSelectionRange(cursorPosition, cursorPosition);
});