Necesito una función para cambiar cualquier contenido de celda de tabla aleatoria a algún otro. Código HTML:
<!DOCTYPE html> <html> <head> <script src="js.js"></script> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" type="text/css" href="styles.css" media="screen, projection"> <title>Lab1</title> </head> <body> <h1>1 Laboratorinis darbas </h1> <table id="myTable"> <caption id=a><strong>Automobiliai</caption></strong> <tr> <th>Modelis</th> <th>Gamintojas</th> <th>Metai</th> <th>Variklio Numeris</th> </tr> <script> arraytotable() secondClick() </script> </table> <button type="button" id="test" onclick="pavadinimas(); secondClick()">Mygtukas</button> <input type="submit" class="button" value="Add another line" onclick="addField(this);" /> </body> </html>
Código JS para poner una matriz en mi tabla:
function arraytotable(){ var array = [ ["A4", "Audi", "2015", "1234"], ["A3", "Audi", "2011", "1542"], ["335i", "BMW", "2012", "9874"], ["440d", "BMW", "2015", "1975"], ["Civic", "Honda", "2002", "6574"]] var table = document.getElementById("myTable"); for(var i = 0; i < array.length; i++) { // create a new row var newRow = table.insertRow(table.length); for(var j = 0; j < array[i].length; j++) { // create a new cell var cell = newRow.insertCell(j); // add value to the cell cell.innerHTML = array[i][j]; } }
Empecé por incluir el código que contaría la cantidad de clics realizados en ese botón, pero no sé cómo acceder a los datos de mi tabla en esa función:
var cnt=-1; function secondClick(){ cnt+=1; console.log(cnt); }
Si dejamos que el botón llame a una función, podemos usar esa función para contar el número de clics y llamar a arraytotable
si es necesario
pero no sé cómo acceder a los datos de mi tabla en esa función
No es necesario, ya usó document.getElementById("myTable")
para obtener la tabla dentro de la función arraytotable
.
var cnt=0; function onButtonClick(){ cnt+=1; if (cnt === 2) { arraytotable(); } } function arraytotable(){ var array = [ ["A4", "Audi", "2015", "1234"], ["A3", "Audi", "2011", "1542"], ["335i", "BMW", "2012", "9874"], ["440d", "BMW", "2015", "1975"], ["Civic", "Honda", "2002", "6574"] ]; var table = document.getElementById("myTable"); for(var i = 0; i < array.length; i++) { // create a new row var newRow = table.insertRow(table.length); for(var j = 0; j < array[i].length; j++) { // create a new cell var cell = newRow.insertCell(j); // add value to the cell cell.innerHTML = array[i][j]; } } }
<h1>1 Laboratorinis darbas </h1> <table id="myTable"> <caption id=a><strong>Automobiliai</caption></strong> <tr> <th>Modelis</th> <th>Gamintojas</th> <th>Metai</th> <th>Variklio Numeris</th> </tr> </table> <button type="button" id="test" onclick="onButtonClick()">Mygtukas</button> <input type="submit" class="button" value="Add another line" onclick="addField(this);" />
Usé este fragmento de código para llamar a la tabla desde otra función y cambiar el valor en ella:
var table = document.getElementById("myTable"); table.rows[].cells[].innerHTML = array[][].bold();