SOURCE

console 命令行工具 X clear

                    
>
console
document.onkeyup = function (event) {
  var textarea = document.getElementById('fit2')
  var pre = document.getElementById('fit1');
  pre.innerHTML = textarea.value;
}
<div class="parent">
  <pre id="fit1" class="fit1"></pre>
  <textarea id="fit2" class="fit2"></textarea>
</div>
* {
  box-sizing: border-box;
}

.parent {
  position: relative;
}
  
.fit1{
  width: 674px;
  padding: 5px;
  border: 1px solid #e6e6e6;
  min-height: 32px;
  max-height: 100px;
  line-height: 20px;
  border-radius: 3px;
  font-size: 14px;
  overflow: hidden;
  word-wrap: break-word;
  white-space: pre-wrap;
  visibility: hidden;
}

.fit2{
  position: absolute;
  top: 0;
  bottom: 0;
  width: 674px;
  padding: 5px;
  min-height: 32px;
  max-height: 100px;
  line-height: 20px;
  resize: none;
  border: 1px solid #e6e6e6;
  border-radius: 3px;
  overflow: hidden;
  word-wrap: break-word;
}