使用JavaScript将图像设置为输入

Question

我正在玩游戏，我希望得到一个img标签，以与输入Unicode字符相同的方式输入结果。

这是数组：

var wqV = [' ', '\u2613', "<img src='../images/o.png'>"];

以下是将默认设置为wqV [0]的代码部分，用户单击将其更改为wqV [1]，并且AI假设显示wqV [2]。

//listening to inputs and setting default value
inputs.forEach(function (myCl) { //myCl are the ids of the HTML
            var ele, mdiv;
            ele = UI.ById(myCl);
            mdiv = document.createElement("div");
            ele.addEventListener("click", UI.myTicFunc(myCl), false);
            mdiv.innerHTML = wqV[0];
            ele.value = (mdiv.textContent || mdiv.innerText);
        });
  // places wqV[1] anywhere the user clicks
myTicFunc: function (myCl) {
        return function () {
            var mdiv = document.createElement("div");
            mdiv.innerHTML = wqV[1];
            UI.ById(myCl).value = (mdiv.textContent || mdiv.innerText);
            UI.myAI(myCl);
        }
    }

UI.myAI是用一堆嵌套的if语句设置wqV [2]的函数，如下所示：

if (sq5.value === " ") {
            sq5.value = wqV[2];
            sq5.disabled = true;
        }

我感谢任何能够腾出时间帮助我将图像显示为价值的人。

[edit]这是我尝试的另一种方法。我创建了一个新的div然后给了它一个id。在我的CSS上我设置了背景图像，但它仍然没有显示

        var myimg;
            myimg = document.createElement("div");
            myimg.id = "cpId";
            sq5.value = (myimg.textContent || myimg.innerText);

#cpId {
    background-image: url('../images/o.png');
    background-size:cover;
}

这是我尝试的另一种尝试，评论中有人已经尝试过。

var mimg;
    mimg = document.createElement("img");
    mimg.src = wqV[2];
    sq5.value = (mimg.textContent || mimg.innerText);
    sq5.disabled = true;