关于使用js改变div颜色的问题

如图这个效果，在文本框里输入一个颜色，点击改变颜色按钮，上边div会变成相应的颜色，这个效果该怎么样实现？

基于问题

1. 设置按钮属性id值，然后获取id值，let div = document.getElementById(按钮的id);
2. 设置输入框的id值，获取输入框的值，通过let value = document.getElementById(输入框的id).value;
3. 设置变颜色的div的id值，获取变颜色的div的id值，通过1的按钮点击事件，把2的value值赋值给 变颜色的div的值
   document.getElementById(变颜色div的id).style.background = value；

ps：
let div = document.getElementById(按钮的id);
div.onclick = function() {
let value = document.getElementById(输入框的id).value;
document.getElementById(变颜色div的id).style.background = '#' + value;
}

备注：如果输入框没有写颜色的#，在下面的点击事件就需要加上#, 颜色才会生效
祝好 如有帮助 望点赞采纳

通过属性控制，点击时候获取当前div，第div.styles.background = 当前输入的值

说一下思路
文本框，你输入的是中文还是英文？
点击按钮获取文本框的value值，如果是中文你就得判断一下，要是英文，如果是颜色的话，就让这个值为div的背景颜色

建议文本框改为下拉框，下拉选择颜色，将其对应的颜色设为div、的背景色即可