¿Cómo modificar dinámicamente el contenido de la tabla solo a través de js?

& ltTable? id = 'prueba'>? //Definir una tabla

& lttr & gt

& lttd & gt& lt/TD & gt;& lttd & gt& lt/TD & gt;

</tr>

</table>

<script>

var? ¿Tuberculosis? =?document . getelementbyid(' test ');//Obtener el nodo dom de la tabla

var? ¿td? =?tb.filas[0]. Cell[0]; //Obtiene la celda td en la fila 0 y la columna 0.

td.innerHTML? =?'222';//Modificar dinámicamente el contenido de la tabla a 222.

& lt/script & gt;

& lt/body & gt;

Ideas:

1, consigue el dom de el nodo de la tabla

2. Coloque la celda td a través de filas y celdas.

3. Amplíe los datos modificando el HTML interno

JS realiza las operaciones de agregar, modificar y eliminar tablas dinámicas

En primer lugar , Funciones JS relacionadas

Función setParamslist() {

var tab = document .getelementbyid(" tab ");

//fila de tabla

var filas = pestaña .longitud de las filas;

//Número de columnas de la tabla

var celdas = pestaña de longitud de las celdas;

//alert(" filas "+filas+" columnas "+celdas);

var rowData =

for(var I = 1; i< fila; i++ ) {

var datos de celdas = new Array();

for(var j = 0; j & lt celdas-1; j++) {

cellsData . push(tab.rows[i].cell[j].innerText);

}

datos de fila = datos de fila+" | "+datos de celdas;

}

document . getelementbyid(" lista de parámetros "). value = rowData

}

//Abra la interfaz para nuevos parámetros de aplicación relacionados.

Función openAppParamsPage() {

var param = new Object();

//Este parámetro debe pasarse.

param.win = ventana

param id = 100

param.name = " prueba

param . cumpleaños = nuevo Fecha();

var resultado = ventana. showmodaldialog(" addParamsItem ", " ancho del diálogo: 500 px; alto del diálogo: 600 px; diálogo izquierdo: 200 px; parte superior del diálogo = 200 px "); /p>

//var temp = documento. getelementbyid(" lista de parámetros ").

valor = temporal + resultado;

addSort(resultado);

}

//Agregar función de parámetro de aplicación

Función addSort(datos) ){

var nombre = datos

if(nombre == ""||nombre==undefinido ) {

Retorno;

}

console.log(data);

var params = data.split(",");

var nombre del parámetro = params[0] ;

var código de parámetro = params[1];

var valor de parámetro = params[2];

var fila = document . );

row.setAttribute("id ", código de parámetro);

var celda = documento. createelement(" TD "); (documento . crear nodo de texto (nombre del parámetro));

row.appendChild(cell);

cell = document . >celda .appendchild(documento .crear nodo de texto(código de parámetro));

row.appendChild(celda);

celda = crearelemento(" TD "); p>

celda.appendchild(documento.crear nodo de texto(valor de parámetro));

fila.appendChild(celda);

var botón de eliminación = crearelemento(" input ");

botón eliminar . establecer atributo(" tipo ", " botón ");

botón eliminar . establecer atributo(" valor ", " eliminar ");

botón eliminar . onclick = function(){ eliminar ordenar(código de parámetro);};

celda = documento . createelement(" TD ");

celda. appendchild(botón eliminar);

row.appendChild(celda);

documento .

appendChild(row);

}

//Eliminar función de parámetro de aplicación

Función eliminarSort(id) {

If (id! =null){

var filaParaDelete = documento . getelementbyid(id);

var ordenar lista = documento .getelementbyid(" ordenar lista "); list . remove child(rowToDelete);

}

}

2. Abra la página del cuadro, agregue o modifique parámetros y vuelva a escribir los datos relevantes.

<! DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transicional//ES " " http://www . w3 . org/TR/XHTML 1/DTD/XHTML 1-Transicional . DTD " & gt;

& lthtml xmlns = " http://www . w3 . org/1999/XHTML " & gt;

& lthead & gt

& ltmeta http-equiv = " Tipo de contenido " Contenido = " text/html; charset=utf-8" />

& lttitle & gtNueva aplicación

& lt# include "/views/head ". /& gt;

& lt/head & gt;

& ltbody & gt

& ltdiv class="body-box " >> p>

& ltdiv class="clear " >& lt/div & gt;

& ltform& gt

& lttable width = " 100% " espaciado de celdas = " 1 " relleno de celda = " 2 " border = " 0 " class = " pn-f table " >>p>

& lttr & gt

& lttd & gtNombre del parámetro:

& lttd class="pn-fcontent " >& ltinput type = " text " maxlength = " 20 " class = " "? requerido = "verdadero"? id = " nombre del parámetro " nombre = " nombre del parámetro "/& gt;& lt/TD & gt;

& lt/tr & gt;

& lttr & gt p>

& lttd & gtCódigo de parámetro:

& lttd class="pn-fcontent " >& ltinput type = " text " maxlength = " 20 " class = " "? requerido = "verdadero"? id = " código de parámetro " nombre = " código de parámetro " requerido = " verdadero "/></TD>?

& lt/tr & gt;

& lttr & gt

& lttd & gt valor del parámetro:

& lttd class= "pn-fcontent " >& ltinput type = " text " maxlength = " 20 " class = " "? requerido = "verdadero"? id = " valor de parámetro " nombre = " valor de parámetro " requerido = " verdadero "/></TD>?

& lt/tr & gt;

& lttr & gt

& lttd align="center" colspan="4 "

<ipo de entrada = "enviar" valor = "guardar" al hacer clic

= " devolver resultado();"/& gt;

& ltinput type = " botón " valor = " Devuelve " onclick = " cerrar ventana();"/& gt;

& lt/TD & gt;

& lt/tr & gt;

& lt/table & gt;

& lt/form & gt;

& lt/div & gt;

& lt/body & gt;

& lt/html & gt;

& ltscript type = " text/JavaScript " & gt;

//Cerrar la ventana directamente

Función closeWindow() {

ventana.close().

}

//Obtiene el valor y lo devuelve después del ensamblaje.

La función devuelve resultado(){

if (!$('form ').valid())

Return;

var nombre del parámetro = documento . getelementbyid(" nombre del parámetro ");

código del parámetro var = documento . getelementbyid(" código del parámetro ");

valor del parámetro var = documento . ( " valor del parámetro ");

//alert("el valor es "+ nombreparam.valor +", "+ códigoparam.valor +", "+valor param. valor);

var resultado = paramName.value +", "+ paramCode.value +", "+valor de parámetro;

ventana.returnValue = resultado

ventana.close(). .

}

& lt/script & gt;