将多个contenteditable div内容写入textarea的JS代码求检查

原代码存在的问题 #

• 循环变量i重复声明使用，内层循环的i会覆盖外层循环的i值，直接导致外层循环逻辑混乱
• 赋值语句语法错误：外层循环中给textarea赋值的语句后直接接了内层循环，没有完成合法的赋值逻辑
• 不必要的嵌套循环：你的需求是对应下标的div内容写入对应下标的textarea，两个数组长度一致，不需要双层循环，单层循环即可完成对应赋值

修复后代码 #

如果需要保留div内的HTML格式写入textarea：

var myContentArr = ["myContent1", "myContent2", "myContent3", "myContent4", "myContent5", "myContent6"];
var hiddenArr = ["hidden1", "hidden2", "hidden3", "hidden4", "hidden5", "hidden6"];

function myFunction(){
    // 两个数组长度一致，单层循环对应赋值即可
    for (var i = 0; i < hiddenArr.length; i++) {
        // 下标对应的div内容赋值给对应下标textarea
        document.getElementById(hiddenArr[i]).value = document.getElementById(myContentArr[i]).innerHTML;
    }
    return true;
}

如果只需要提取div的纯文本内容写入（推荐，避免多余HTML标签或XSS风险），把innerHTML替换为innerText即可：

document.getElementById(hiddenArr[i]).value = document.getElementById(myContentArr[i]).innerText;

额外优化建议 #

• 可以先判断两个数组长度是否一致，避免出现下标越界的问题
• 可以在获取DOM元素后加非空判断，避免某个id不存在时报错

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