Schaltfläche zu dynamisch generierter HTML-Tabelle hinzufügen

Question

Ich versuche, eine Schaltfläche für jede Zeile der dynamisch generierten HTML-Tabelle mit JavaScript hinzuzufügen. Hier ist mein Code:

// helper function   
function addCell(tr, text) { 
    var td = tr.insertCell(); 
    td.innerHTML = text; 
    return td; 
} 

// insert data 
list.forEach(function (item) { 
    var row = table.insertRow(); 
    var button = document.createElement('button'); 
    var bText = document.createTextNode('View'); 
    button.appendChild(bText); 
    addCell(row, item.itemName); 
    addCell(row, '$ ' + item.total.toFixed(2)); 
    addCell(row, button); 
}); 

Ich habe es geschafft, alle anderen Felder außer der Schaltfläche auszudrucken. Die Spalte für die Schaltfläche nur einfach aus dieser gedruckt:

[object HTMLButtonElement] 

Nur frage mich, ob es überhaupt ist ein Bild-Taste, um die dynamisch generierte Tabelle hinzufügen? Nach dem Auswählen der Schaltfläche wollte ich den Wert der Zeile abrufen und als Parameter an eine andere Funktion übergeben.

Answer 1

Here the fiddle. Was du willst, weiß ich nicht. Auf diese Weise können Sie die Linie erreichen.

var previousitem=null; 
function removeRowbyItem(item) { 
     item.parentElement.parentElement.style.backgroundColor="red"; 
     if(previousitem!=null){ 
     previousitem.style.backgroundColor=""; 
     console.log(previousitem); 
     } 
    previousitem=item.parentElement.parentElement; 
} 
removeRow.innerHTML = "click me"; 
removeRow.onclick = function() { 
    removeRowbyItem(this); 
}; 

Answer 2

können Sie td.appendChild(button); verwenden

function addCell(tr, text) { 
    var td = tr.insertCell(); 
    td.innerHTML = text; 
    return td; 
} 
//for append button 
function addButtonToCell(tr, button) { 
    var td = tr.insertCell(); 
    td.appendChild(button); 
    return td; 
} 
// insert data 
list.forEach(function (item) { 
    var row = table.insertRow(); 
    var button = document.createElement('button'); 
    var bText = document.createTextNode('View'); 
    button.appendChild(bText); 
    addCell(row, item.itemName); 
    addCell(row, '$ ' + item.total.toFixed(2)); 
    addButtonToCell(row, button); 
});