HTML代码：textarea id=deepL-text style=display block; placeholder= 放 DeepL 的通篇纯文本翻译。 双击内容可以滚动到顶部。 spellcheck=truetextarea div id=back-divdiv CSS#back-div width 100; background-color green; position

要实现你想要的效果，你需要对JS代码进行一些修改。具体来说，你需要修改updateBackgroundDiv()函数，使它只更新#back-div元素自身的样式，而不是在它内部创建新的div元素。下面是修改后的代码：

function updateBackgroundDiv() { const selection = window.getSelection(); if (selection.rangeCount === 0) { return; // 如果没有选区，则不进行任何操作 }

const range = selection.getRangeAt(0); const rect = range.getBoundingClientRect(); const lineHeight = parseFloat(window.getComputedStyle(textarea).lineHeight); const topOffset = rect.top - textarea.getBoundingClientRect().top; const lineIndex = Math.floor(topOffset / lineHeight); if (lineIndex < 0) { return; // 如果光标在第一行之上，则不进行任何操作 } const lineTop = lineIndex * lineHeight; const lineBottom = (lineIndex + 1) * lineHeight; const scrollTop = textarea.scrollTop; const clientHeight = textarea.clientHeight; const scrollBottom = scrollTop + clientHeight; const visibleLineTop = Math.max(scrollTop, lineTop); const visibleLineBottom = Math.min(scrollBottom, lineBottom); const visibleLineHeight = visibleLineBottom - visibleLineTop; backgroundDiv.style.top = visibleLineTop + 'px'; backgroundDiv.style.height = visibleLineHeight + 'px'; }

这段代码的作用是根据光标所在的位置，计算出#back-div元素应该具有的样式，然后直接修改#back-div元素的样式。这样，每次点击或输入时，#back-div元素的样式都会被更新，而不会在它内部创建新的div元素