Javascript operation tables include obtaining values and creating tables
<Input id = "txtping"/> <table width = "400" border = "0" cellspacing = "0" cellpadding = "1" id = "ch"> <tr> <td> Beijing, China </td> </tr> <td> Shanghai, China </td> </tr> </table> <script language = "javascript" type = "text/javascript"> var tabobj = document. getElementById ("ch"); // obtain the Table object for (var I = 0; I <tabobj. rows. length; I ++) // Add an event to the cell {tabobj. rows [I]. onclick = function () {document. getElementById ("txtping "). value = this. innerText ;}; // value: tabobj. rows [I]. onmouseover = function () {this. style. background = "# 0EF" ;}; // The row color changes tabobj. rows [I]. onmouseout = function () {this. style. background = "" ;}; tabobj. rows [I]. style. cursor = "pointer";} function sets (obj) {document. getElementById ("p1 "). style. top = document. getElementById (obj ). offsetTop + document. getElementById (obj ). offsetHeight + "px"; document. getElementById ("p1 "). style. left = document. getElementById (obj ). offsetLeft + document. body. scrollLeft + "px";} // Add table function creatTable () to javascript {// use the createElement function to create tbody, tr, td, textNode element // meaning of each element is not described here var tables = document. createElement ("table"); tables. setAttribute ("id", "chen"); tables. setAttribute ("border", "1px"); tables. setAttribute ("width", "300px"); var tbody = document. createElement ("tbody"); var row = document. createElement ("tr"); var cell = document. createElement ("td"); var textNode = document. createTextNode ("test"); // because each element is a relationship between a node and a subnode, use the appendChild () function to connect each node to the cell. appendChild (textNode); row. appendChild (cell); tbody. appendChild (row); tables. appendChild (tbody); document. getElementById ("p3 "). appendChild (tables); // Add to the layer whose ID number is p3} // Add the method for each cell (var j = 0; j <tabobj. rows. length; j ++) // The row {for (var h = 0; h <tabobj. rows. item (0 ). cells. length; h ++) // cell {tabobj. rows [j]. cells [h]. onclick = function () {ch (this) ;}}} script
[Ctrl + A select all Note: If you need to introduce external Js, You need to refresh it to execute]