使用javascript将行号添加到文本区域

var textarea = document.getElementById('textarea');

textarea.addEventListener('scroll', updateLineNumbers);

var lineNumbers = document.createElement('div');
lineNumbers.style.position = 'absolute';
lineNumbers.style.left = '0';
lineNumbers.style.top = '0';
lineNumbers.style.width = '30px'; // 调整宽度以适应行号的长度
lineNumbers.style.height = textarea.scrollHeight + 'px'; // 设置高度与文本区域相同

function updateLineNumbers() {
  var scrollTop = textarea.scrollTop;
  var lineHeight = parseInt(getComputedStyle(textarea).lineHeight);
  var startLine = Math.floor(scrollTop / lineHeight) + 1;
  var endLine = startLine + Math.ceil(textarea.clientHeight / lineHeight);

  lineNumbers.innerHTML = '';
  for (var i = startLine; i <= endLine; i++) {
    var line = document.createElement('div');
    line.textContent = i;
    lineNumbers.appendChild(line);
  }
}

textarea.parentNode.insertBefore(lineNumbers, textarea);

var textarea = document.getElementById('textarea');
var lineNumbers = document.createElement('div');
lineNumbers.style.position = 'absolute';
lineNumbers.style.left = '0';
lineNumbers.style.top = '0';
lineNumbers.style.width = '30px';
lineNumbers.style.height = textarea.scrollHeight + 'px';

textarea.addEventListener('scroll', updateLineNumbers);

function updateLineNumbers() {
  var scrollTop = textarea.scrollTop;
  var lineHeight = parseInt(getComputedStyle(textarea).lineHeight);
  var startLine = Math.floor(scrollTop / lineHeight) + 1;
  var endLine = startLine + Math.ceil(textarea.clientHeight / lineHeight);

  lineNumbers.innerHTML = '';
  for (var i = startLine; i <= endLine; i++) {
    var line = document.createElement('div');
    line.textContent = i;
    lineNumbers.appendChild(line);
  }
}

textarea.parentNode.insertBefore(lineNumbers, textarea);