当输入位于同样使用 JS DOM 构建的表中时，无法使用 JS DOM 设置输入值

Question

我正在用 JS DOM 构建一个 HTML 表。一些单元格有文本输入，我想在同一个 JS 块中设置这些文本输入的值。似乎无论我做什么，浏览器都拒绝呈现我设置的值。对于以下代码的某些上下文，这发生在类的方法中。该类的构造函数有一个名为“elem”的对象，我在其中预定义了大部分正在使用的元素。一切都完美呈现，但输入是 100% 空的。this.elem.cont = document.createElement('div'); this.elem.hold = document.createElement('div')this.elem.cont.id = 'popupcont'; this.elem.hold.id = 'popuphold'this.elem.umTable = document.createElement('table'); this.elem.umTable.id = 'usermantable'this.elem.umRow = document.createElement('tr')this.elem.umCell = document.createElement('td')this.elem.umCell.innerHTML = 'Username'this.elem.umRow.appendChild(this.elem.umCell)this.elem.umCell = document.createElement('td')this.elem.umCell.innerHTML = 'Name'this.elem.umRow.appendChild(this.elem.umCell)this.elem.umCell = document.createElement('td')this.elem.umCell.innerHTML = 'Password'this.elem.umRow.appendChild(this.elem.umCell)this.elem.umCell = document.createElement('td')this.elem.umCell.innerHTML = 'Confirm password'this.elem.umRow.appendChild(this.elem.umCell)this.elem.umCell = document.createElement('td')this.elem.umCell.innerHTML = 'Can blog?'this.elem.umRow.appendChild(this.elem.umCell)this.elem.umCell = document.createElement('td')this.elem.umCell.innerHTML = 'Manage calendar?'this.elem.umRow.appendChild(this.elem.umCell)this.elem.umCell = document.createElement('td')this.elem.umCell.innerHTML = 'Is admin?'this.elem.umRow.appendChild(this.elem.umCell)this.elem.umTable.appendChild(this.elem.umRow)this.elem.umRow = document.createElement('tr')然后将 cont 附加到 DOM 中的适当元素。它呈现完美，但无论我尝试什么，文本输入都是空的。我尝试在将输入附加到单元格之前和之后以及将单元格附加到行之后更改值。我为输入、单元格和行创建了新的“let”变量，而不是使用 this.elem 定义的变量。文本输入始终呈现为空。在此先感谢您的帮助:-)

Answer 1

我找到了该问题的解决方案。我没有使用 element.value，而是使用 element.setAttribute('value', 'blah blah blah...') 并且这有效。

太棒了：

this.elem.umRow = document.createElement('tr')

this.elem.umCell = document.createElement('td')

this.elem.uaeInput = document.createElement('input'); this.elem.uaeInput.type = 'text'

this.elem.uaeInput.value = edit ? user.uname : ''

this.elem.umCell.appendChild(this.elem.uaeInput); this.elem.umRow.appendChild(this.elem.umCell)

变成这样：

this.elem.umRow = document.createElement('tr')    

this.elem.umCell = document.createElement('td')

this.elem.uaeInput = document.createElement('input'); this.elem.uaeInput.type = 'text'

this.elem.uaeInput.setAttribute('value', edit ? user.uname : '')

this.elem.umCell.appendChild(this.elem.uaeInput); this.elem.umRow.appendChild(this.elem.umCell)

希望对某人有所帮助！