Is there any better way for creating a dynamic HTML table without using any javascript library like Jquery YUI etc -

Do not worry we do not need to know any bugs in this code. It's working perfectly.

My owner came to me and said, "Just tell me what is the best way to write for the dynamic HTML table (add row, delete row, update line). There is no need to add css, just javascript, no jQuery library etc. I was confused in the middle of the project why he was demanding some stupid practice like this and sent it and sent it to 15 minutes A After I got a mail from him. "

I was expecting much better code from a man like you anyway good monkey. (And with a picture of the monkey in the form of an attachment.)

This mail was line-line.

I want to answer them, but before I want to know about the quality of my code. It's really small ... !!! Or he was just joking about me.

I do not think the code is really small if you can still give me the right place. The code is working fine. Just paste it into an HTML file.

  & lt; Html & gt; & Lt; Top & gt; & Lt; Title & gt; Nonsense work & lt; / Title & gt; & Lt; Script type = "text / javascript" & gt; Function add_row () {var table = document.getElementById ('Table'); Var rowCount = table.rows.length; Var line = table.insertRow (rowCount); Var cell1 = row.insertCell (0); Var element1 = document.createElement ("input"); Element1.type = "text"; Cell1.appendChild (element1); Var cell 2 = Row.Intel (1); Var element2 = document.createElement ("input"); Element2.type = "text"; Cell2.appendChild (element2); Var cell3 = row.insertCell (2); Cell3.innerHTML = '& lt; Span onClick = "edit (this)" & gt; Edit & lt; / Span & gt; / & Lt; Span onclick = "delete_row (this)" & gt; Remove & lt; / Span & gt; '; Cell3.setAttribute ("Style", "Display: None";); Var cell4 = row.insertCell (3); Cell4.innerHTML = '& lt; Span onclic = "save (this)" & gt; Save & lt; / Span & gt; '; } Save the function (e) {var elTableCells = e.parentNode.parentNode.getElementsByTagName ("td"); ElTableCells [0] .innerHTML = elTableCells [0] .firstChild.value; ElTableCells [1] .innerHTML = elTableCells [1] .firstChild.value; ElTableCells [2] .setAttribute ("Style", "Display: Block;"); ElTableCells [3] .setAttribute ("Style", "Display: None";); } Edit the function (e) {var elTableCells = e.parentNode.parentNode.getElementsByTagName ("TD"); ElTableCells [0]. WinnerHTML = '& lt; Input type = "article" value = "'+ elhetable seals [0] .innerHTML +'" & gt; '; ElTableCells [1] .innerHTML = '& lt; Input type = "text" value = "'+ elhetable seals [1] .innerHTML +'" & gt; '; ElTableCells [2] .setAttribute ("Style", "Display: None";); ElTableCells [3] .setAttribute ("Style", "Display: Block;"); } Function delete_row (e) {e.parentNode.parentNode.parentNode.removeChild (e.parentNode.parentNode); } & Lt; / Script & gt; & Lt; / Head & gt; & Lt; Body & gt; & Lt; Div id = "display" & gt; & Lt; Table id = 'table' & gt; & Lt; Tr id = 'id' & gt; & Lt; TD & gt; Pemson & lt; / Td> & Lt; TD & gt; 23 & lt; / Td> & Lt; Td> & Lt; Span onClick = "edit (this)" & gt; Edit & lt; / Span & gt; / & Lt; Span onClick = "delete_row (this)" & gt; Remove & lt; / Span & gt; & Lt; / TD & gt; & Lt; Td style = "display: none;" & Gt; & Lt; Span onClick = "save (this)" & gt; Save & lt; / Span & gt; & Lt; / TD & gt; & Lt; / TR & gt; & Lt; / Table & gt; & Lt; Input type = "button" value = "add new row" onClick = "add_row ();" / & Gt; & Lt; / Div & gt; & Lt; / Body & gt;  

Here are some things that I will fix:

1. Wrap it properly. Probably in the global scope for re-usable = no-numbers
2. Supporting more than one table per page
3. Make it configurable! Now you have to enter and edit the code to add a new column.
4. Try short internal HTML, and more dom type a quotation in your text box and see it break.
5. No setting event handler with HTML attributes. Use at least "DOM level 0" property ( .onclick ) or better, addEventListener (and attachEvent )
6. Display: Block to gt; Setting it to is probably not what you want.

If I asked anyone to create an editable table for a library, I do not accept your implementation.

I give them the list above instead of sending a monkey picture, though. Your boss is immature next time when he randomly sends you an email for code, then mail it to you with a brief description, offer features and implementation, and think of it in advance.