如何更改表格單元格的innerHTML

我有一個editRow函數，它應該啓用文本框，而不是之前在單元格innerHTML中的文本。我需要更新單元格innerHTML，以便代替文本，它應該是一個帶有文本的文本框。我試過，但沒有做的工作：如何更改表格單元格的innerHTML

function edit(index) 
{ 
    var currentRow=document.getElementById("row-"+index); 
    var textBox=document.createElement('input'); 
    textBox.type= "text"; 
    textBox.id= "text-box"+(index); 
    textBox.innerHTML= currentRow.cells[0].innerHTML; 
    currentRow.cells[0].innerHTML = textBox ; 
}

我需要這樣的東西appenChild但替換舊的內容，而thna追加到它。

來源

2017-05-28 user7945230

'textBox'是輸入，它具有價值，但不能包含其他元素？ – adeneo

我希望它的值是該單元格中的當前文本。我可能有用戶值屬性，而不是innerHTML？ – user7945230

然後，您將使用'value'屬性，而不是'innerHTML'屬性。不過，'textBox'是一個元素，而一個對象，它不能被設置爲'innerHTML' – adeneo

一個value爲input，而不是innerHTML，並明確td追加之前，設置一個input：

function edit(index) { 
 
    var currentRow=document.getElementById("row-"+index); 
 
    var textBox=document.createElement('input'); 
 
    textBox.type= "text"; 
 
    textBox.id= "text-box"+(index); 
 
    textBox.value= currentRow.cells[0].innerHTML; // set input value 
 
    currentRow.cells[0].innerHTML = null; // delete previous innerHTML 
 
    currentRow.cells[0].appendChild(textBox) // add child 
 
} 
 

 
edit(1)

<table> 
 
    <tbody> 
 
    <tr id="row-1"><td>Hello</td></tr> 
 
    </tbody> 
 
</table>

來源

2017-05-28 14:50:12 wostex

如何更改表格單元格的innerHTML

回答

相關問題