如何用JavaScript给文本框每行首尾分别添加<div>和</div>？

你的代码问题在于没有将文本框的内容按行拆分成数组，而是把整个内容作为数组的单个元素，所以循环只执行一次，只会给整个内容首尾加标签。

修正后的代码： #

// 获取文本框内容并按换行符拆分成每行的数组
var lines = document.getElementById("text1").value.split('\n');
// 存储处理后的每行内容
var processedLines = [];

for (var i = 0; i < lines.length; i++) {
    // 跳过空行（可选，根据需求调整）
    if (lines[i].trim() !== '') {
        processedLines.push('<div>' + lines[i] + '</div>');
    }
}

// 将处理后的数组合并成带换行的字符串，赋值给目标文本框
document.getElementById("text2").value = processedLines.join('\n');

代码说明： #

• split('\n')：把文本框的内容按换行符拆分成数组，每个元素对应一行文本
• 循环遍历每行内容，给每行包裹<div>标签，同时可选择跳过空行，避免生成空的<div></div>
• join('\n')：把处理后的数组重新合并成带换行的字符串，保证输出格式和原文本的换行一致

测试效果： #

如果原textarea内容是：

text line 1
text line 2
text line 3

处理后会输出：

<div>text line 1</div>
<div>text line 2</div>
<div>text line 3</div>

内容的提问来源于stack exchange，提问作者Mohsin Ali