-1
私はjavascriptコアで新しくなっていますが、テーブルから行を削除したいのですが、新しい行を追加した後にそれらを削除したいのです。その後、私はconsole.log()を使ってみましたが、どうしたら問題を解決できますか?一度削除するとアイテムが戻ってきます
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Practica #1</title>
</head>
<body>
<form id="frmLibros" onsubmit="return false">
<div>
<label for="">Nombre:</label><br>
<input type="text" id="nombre_libro" name="nombre_libro">
</div>
<div>
<label for="">Autor:</label>
<input type="text" id="autor" name="autor">
</div>
<div>
<label for="">Genero:</label>
<select name="genero" id="genero">
<option value="Comedia">Comedia</option>
<option value="Terror">Terror</option>
<option value="Historia">Historia</option>
</select>
</div>
<button id="agregar_libro">Agregar</button>
</form>
<table id="myTable">
<thead>
<tr>
<th>Nombre</th>
<th>Autor</th>
<th>Genero</th>
<th> </th>
</tr>
</thead>
<tbody id="libros"></tbody>
</table>
</body>
<script type="text/javascript">
var tablaLibros = document.getElementById("libros");
var txtLibro = document.getElementById("nombre_libro");
var txtAutor = document.getElementById("autor");
var cmbGenero = document.getElementById("genero");
var btnAgregar = document.getElementById("agregar_libro");
var libros = [];
var id = 1;
var idLibro = 0;
function editarLibro(){
var book = this.libro;
idLibro = book.id;
txtLibro.value = book.nombre_libro;
txtAutor.value = book.autor;
cmbGenero . value = book.genero;
btnAgregar.textContent = "Modificar";
}
function eliminar(){
document.getElementById('myTable').deleteRow(this.parentNode.parentNode.rowIndex)
}
function agregarLibro(){
var libro = txtLibro.value;
var autor = txtAutor.value;
var genero = cmbGenero.value;
txtLibro.value = "";
txtAutor.value = "";
if (idLibro == 0) {
var item = {
id: id,
nombre_libro: libro,
autor: autor,
genero: genero
};
id++;
libros.push(item);
}else{
for (var i = 0; i < libros.length; i++) {
if (idLibro == libros[i].id) {
libros[i].nombre_libro = libro;
libros[i].autor = autor;
libros[i].genero = genero;
}
}
idLibro = 0;
btnAgregar.textContent = "Insertar";
}
while (tablaLibros.childElementCount >0){
tablaLibros.removeChild(tablaLibros.firstChild);
}
for (var i = 0; i < libros.length; i++) {
var tr = document.createElement('tr');
var td = document.createElement('td');
var td1 = document.createElement('td');
var td2 = document.createElement('td');
var td3 = document.createElement('td');
tr.appendChild(td);
td.textContent = libros[i].nombre_libro;
td.libro = libros[i];
td.addEventListener('click', editarLibro);
tr.appendChild(td1);
td1.textContent = libros[i].autor;
td1.libro = libros[i];
td1.addEventListener('click', editarLibro);
tr.appendChild(td2);
td2.textContent = libros[i].genero;
td2.libro = libros[i];
td2.addEventListener('click', editarLibro);
var btnEliminar = document.createElement('button');
btnEliminar.textContent = 'trash';
btnEliminar.libro = libros[i];
btnEliminar.addEventListener('click', eliminar);
tr.appendChild(td3);
td3.appendChild(btnEliminar);
tablaLibros.appendChild(tr);
}
}
btnAgregar.addEventListener('click', agregarLibro);
</script>
</html>
'私は新しいone'を追加したら、それらを再度それらをバック削除したい - あなたはこの文を書き換えるしようとすることができ、ほとんど意味がありませんで –