如何使用dom选择器作为对象中的值迭代对象，然后使用它们来设置值？

阿加瓦尔（Parth Agarwal）

因此，我有一个函数将从数据库返回的对象作为参数。我想在表单中显示对象的值。我为每个要为其设置值的DOM选择器创建了一个键值对。以下是相关代码：

function paintForm(item) {
    let form = {
        id: '',
        name: document.getElementById('name'),
        category: document.getElementById('category'),
        subcategory: document.getElementById('subcategory'),
        price: document.getElementById('price'),
        quantity: document.getElementById('quantity'),
        stock: document.getElementById('stock'),
        operation: document.getElementById('operation'),
        amount: document.getElementById('amount'),
        log: document.getElementById('log')
    }

    Object.keys(item).forEach(key => {
        let formItem = form[key]
        formItem.setAttribute('value', item[key].toString())
    })
}

函数（项目）的传递参数

{
    id: 'asdiu12189ascjo',
    name: 'Nano',
    category: 'Microcontrollers',
    subcategory: 'Arduino',
    price: 250,
    quantity: 20,
    log: ['a', 'b', 'c', 's']
},

这是我尝试过的：

内部HTML

Object.keys(item).forEach(key => {
    form[key].innerHTML = item[key].toString()
})

值

Object.keys(item).forEach(key => {
    form[key].value = item[key].toString()
})

我的理解

使用Object[key]将对象的值带到其对应的键。现在，我不确定是否必须输入该值。我认为该值必须存储为字符串然后进行解析？但是我发布了这篇文章，因为我认为有更好的方法来处理表单值。

我对JS不太熟悉，我只是试图从框架切换到纯js。因此，请不要将我引至库或框架。感谢您的帮助，并在此先感谢大家的贡献。:)

安比安

正如Udo E.在评论中正确指出的那样，如果所有input fields value属性都是属性，那就是走的路：如果有的话，在formItemas上添加一个验证undefined。

Object.keys(item).forEach(key => {
          let formItem = form[key];
          if (formItem) {
            formItem.value = item[key].toString();
          }
        });

如果formItem返回undefined，那么整个循环就是浪费？绝对没有。该if条款仅仅是一些元素，这不是在发现了一个额外的检查DOM通过document.getElementById的form对象。所以，如果将阻止你分配value到的东西formItem.value是没有被发现。在您的情况下考虑一下，因为输入字段和表单对象本身是预定义的，并且formItem总是可以在wrt找到id。该if子句可能不是必需的。