如何替換tr中的所有td元素？

Question

我的父頁面上有html表，其中包含一些數據：

Begin Date  End Date    City
03/28/2017              Toronto 
03/25/2017  03/26/2017  Miami   
03/22/2017  03/24/2017  Chicago
03/16/2017  03/21/2017  Dallas  
03/10/2017  03/15/2017  Austin 

使用完后，更新特定行中的元素，我想替換該行的整個內容。 每行都有唯一的ID。 我必須使用普通的JavaScript Vanilla來做到這一點。 這是我到目前為止的示例：

fnObj.DATA是數字，我的ajax調用成功完成后得到了該數字。 我使用該回調函數中的id來檢測要更新的行。 我不確定替換所有td標簽的最佳技術是什么。 此技術有一個例外。 我已替換數據的行上沒有id。 如果有人知道更好的方法，請告訴我。 謝謝。

window.parent.document.getElementById("New_"+fnObj.DATA).outerHTML = "<td>"+document.getElementById("newBegDt").value+"</td><td>"+document.getElementById("newEndDt").value+"</td><td>document.getElementById("newCity").value</td>";
                        window.parent.document.getElementById(dType+"_"+fnObj.DATA).id = 'New_'+fnObj.DATA;

Answer 1

嘗試這個：

var newtr = "<tr id='" + "New_"+fnObj.DATA  + "'><td>"+document.getElementById("newBegDt").value+"</td><td>"+document.getElementById("newEndDt").value+"</td><td>" + document.getElementById("newCity").value + "</td></tr>";

$("#New_"+fnObj.DATA ).replaceWith(newtr);

如果您不想使用jquery，則可以使用類似以下內容的方法：

var currentTr = document.getElementById("New_"+fnObj.DATA), parent = currentTr.parentNode,
tempDiv = document.createElement('div');

tempDiv.innerHTML =  "<tr id='" + "New_"+fnObj.DATA  + "'><td>"+document.getElementById("newBegDt").value+"</td><td>"+document.getElementById("newEndDt").value+"</td><td>" + document.getElementById("newCity").value + "</td></tr>";

var input = tempDiv.childNodes[0];

parent.replaceChild(input, currentTr);