如何避免在文本框中打印html代码作为值

Question

我正在创建一个动态表并从数组中获取td值，我的目标是当我点击任何转换为​​输入框的单元格并将此td值作为输入值时，我们可以更改，当我点击另一个td时之前的td用新的或相同的旧值转回原来的位置，现在这几乎正在发生，问题是当我点击td它转向输入框时，当我再次点击相同的输入框时，它打印出来＆ ＃39;文本框中的html代码作为它的值，然后所有td都疯了，像这样：它在同一时间创建两个输入框，有时在td内打印html代码而不创建输入框。我是新手，试图学习并坚持这两天，请帮助我出来。提前致谢

var getInput = ""; var inputsParent = ""; var inputs = ""; var thisInHtml = ""; var getInputVal = "";
var thisTdInnerHtml = ""; var input = ""; var flag = 1;

var getInputLength = getInput.length+1;
  for(var j=0; j<allTds.length;j++){         
   allTds[j].onclick = function(){ 
    thisInHtml = this.innerHTML;                 
     var thisId = this.id;                                             

               if(inputs.length != 0){
               inputsParent.removeChild(inputs);   
               inputsParent.innerHTML = getInputVal;     
               flag = 1;
                }

              this.innerHTML = thisInHtml;  
              if(getInputVal != ""){
              input = this.innerHTML =  "<input id='thisInputId' type='text' value='"+thisInHtml+"' style='width: 100px;'>";
              getInput = document.getElementsByTagName("input");
              getInputVal = document.getElementById("thisInputId").value;
          }

              if(getInputLength > 0){                      
               for(var k =0; k<getInputLength;k++){
                 inputsParent = getInput[k].parentNode;
                 inputs = inputsParent.childNodes[0];
        }
     } 
   }            
  }
}