javascript - Understand adding rows on click, confusion with .cloneNode(true); -
consider http://jsfiddle.net/99cl3/224/, adds rows on click
html
<br /><br /> <table id="tbl"> <tr> <td><input type="text" name="links" /></td> <td><input type="text" name="keywords" /></td> <td><input type="text" name="violationtype" /></td> <td><input type="submit" class="button" value="add line" onclick="addfield(this);" /></td> </tr> </table>
js
function addfield(n) { var tr = n.parentnode.parentnode.clonenode(true); document.getelementbyid('tbl').appendchild(tr); }
i'm trying understand why code adds rows on click works. first realize take click (the input), , go 2 parent nodes above it. first .parentnode
points td
, , next tr
. making table on click these new properties. question role of .clonenode(true)
here? have read mozilla documentation, can't understand example. why can't append n.parentnode.parentnode
right away?
each element unique. if don't clone element element moved target location. using clone
here necessary creating another row.
Comments
Post a Comment