当输入在同样由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')
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.umCell = document.createElement('td')
this.elem.uaeInput = document.createElement('input'); this.elem.uaeInput.type = 'text'
this.elem.uaeInput.value = edit ? user.name : ''
this.elem.umCell.appendChild(this.elem.uaeInput); this.elem.umRow.appendChild(this.elem.umCell)
this.elem.umCell = document.createElement('td')
this.elem.uaeInput = document.createElement('input'); this.elem.uaeInput.type = 'password'
this.elem.uaeInput.id = 'uaepass1'
this.elem.umCell.appendChild(this.elem.uaeInput); this.elem.umRow.appendChild(this.elem.umCell)
this.elem.umCell = document.createElement('td')
this.elem.uaeInput = document.createElement('input'); this.elem.uaeInput.type = 'password'
this.elem.uaeInput.id = 'uaepass2'
this.elem.umCell.appendChild(this.elem.uaeInput); this.elem.umRow.appendChild(this.elem.umCell)
this.elem.umCell = document.createElement('td')
this.elem.uaeInput = document.createElement('input'); this.elem.uaeInput.type = 'checkbox'
this.elem.uaeInput.checked = edit ? user.blogpost : 'false'
this.elem.umCell.appendChild(this.elem.uaeInput); this.elem.umRow.appendChild(this.elem.umCell)
this.elem.umCell = document.createElement('td')
this.elem.uaeInput = document.createElement('input'); this.elem.uaeInput.type = 'checkbox'
this.elem.uaeInput.checked = edit ? user.calendar : 'false'
this.elem.umCell.appendChild(this.elem.uaeInput); this.elem.umRow.appendChild(this.elem.umCell)
this.elem.umCell = document.createElement('td')
this.elem.uaeInput = document.createElement('input'); this.elem.uaeInput.type = 'checkbox'
this.elem.uaeInput.checked = edit ? user.admin : 'false'
this.elem.umCell.appendChild(this.elem.uaeInput); this.elem.umRow.appendChild(this.elem.umCell)
this.elem.umTable.appendChild(this.elem.umRow)
this.elem.hold.appendChild(this.elem.umTable)
this.elem.uaeInput = document.createElement('input'); this.elem.uaeInput.type = 'button'
this.elem.uaeInput.value = 'Submit'
this.elem.hold.appendChild(this.elem.uaeInput)
this.elem.hold.innerHTML += '<br />Leave the password fields blank if you do not wish to update the user\'s password.<br />'
this.elem.cont.appendChild(this.elem.hold)

因此，将cont附加到DOM中的适当元素。它可以完美呈现，但是无论我尝试什么，文本输入都是空的。我尝试在将输入追加到单元格之前和之后以及在将单元格追加到行之后更改值。我创建了新的“ let”变量，而不是对输入，单元格和行使用this.elem定义的变量。文本输入始终为空。在此先感谢您的帮助：-）

Answer 1

我找到了解决该问题的方法。我没有使用element.value，而是使用element.setAttribute（'value'，'blah blah blah ...'），此方法有效。

Soooo this：

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)

希望对某人有帮助！