Обновить родительский innerhtml путем изменения значений узлов дочерних узлов? [дублировать] ⇐ Javascript

[Anonymous]

У меня есть родительский элемент DOM (div) с некоторыми детскими элементами (например, ввод и выберите). Для каждого из дочерних элементов я хочу обновить их значение со значениями из ранее сохраненных innerhtml родительского элемента. Однако после изменения значений детей, родители innerhtml < /code> остается неизменным. >

Код: Выделить всё

// user saved the innerHTML of a node some time ago
let loadedHTMLData = '';

// we have a reference innerHTML which may have updated fields
// but only holds meaningless default values
let defaultHTMLData = '';

let node = document.createElement('div');
node.innerHTML = loadedHTMLData; // loaded from somewhere

let refNode = document.createElement('div');
refNode.innerHTML = defaultHTMLData; // reference node

console.log('Before update:', refNode.innerHTML);

// update reference node values with values from the loaded html
for (let child of node.children) {
let key = child.attributes[0].name; // some identifier
let value = child.value;

let refChild = refNode.querySelectorAll('[' + key + ']')[0]; // assume theres always 1 fitting element
console.log('Changing ', key, 's value from ', refChild.value, ' to ', value);
refChild.value = value;
}

console.log('After update: ', refNode.innerHTML);< /code>
< /div>
< /div>
< /p>
output: < /p>
Before update: 
Changing  mykey s value from  -1  to  7
After update:  
< /code>
Я ожидаю, что innerhtml обновится до < /p>
After update:  

Как я могу обновить родителей innerhtml после изменения значений детей?


Подробнее здесь: https://stackoverflow.com/questions/794 ... ode-values