Eu testei o código abaixo e me retornou o erro:
p1-rad1-RE_UP.html:35 Uncaught TypeError: Cannot set property 'innerHTML' of null at Object.listarTodos (p1-rad1-RE_UP.html:35) at p1-rad1-RE_UP.html:100 p1-rad1-RE_UP.html:35 Uncaught TypeError: Cannot set property 'innerHTML' of null at Object.listarTodos (p1-rad1-RE_UP.html:35) at Object.add (p1-rad1-RE_UP.html:58) at HTMLFormElement.onsubmit (p1-rad1-RE_UP.html:7)
O que pode ser?
var cadastro = new function() {
this.veiculos = [];
this.el = document.getElementById("veiculos");
this.itemEditar = -1;
this.listarTodos = function() {
var dados = '';
if (this.veiculos.length > 0) {
for (i = 0; i < this.veiculos.length; i++) {
dados += '<tr>';
dados += '<td>' + this.veiculos[i] + '</td>';
dados += '<td><button onclick="cadastro.alterar(' + i + ')"> Alterar </button></td>';
dados += '<td><button onclick="cadastro.excluir(' + i + ')"> Excluir </button></td>';
dados += '</tr>';
}
}
this.el.innerHTML = dados;
};
this.add = function() {
var id;
id++;
var placa = document.getElementById("add-placa").value;
var marca = document.getElementById("add-marca").value;
var modelo = document.getElementById("add-modelo").value;
if (placa && marca && modelo) {
if (this.itemEditar == -1) {
this.veiculos.push(id);
this.veiculos.push(placa);
this.veiculos.push(marca);
this.veiculos.push(modelo);
} else {
this.veiculos.splice(this.itemEditar, 1, id);
this.veiculos.splice(this.itemEditar, 2, placa.trim());
this.veiculos.splice(this.itemEditar, 3, marca.trim());
this.veiculos.splice(this.itemEditar, 4, modelo.trim());
this.itemEditar = -1;
}
this.listarTodos();
}
this.novo();
};
this.editar = function(item) {
this.itemEditar = item;
var placa = this.veiculos[item];
var marca = this.veiculos[item];
var modelo = this.veiculos[item];
if (placa && marca && modelo) {
var elPlaca = document.getElementById("add-placa");
var elMarca = document.getElementById("add-marca");
var elModelo = document.getElementById("add-modelo");
elPlaca.value = placa;
elMarca.value = marca;
elModelo.value = modelo;
}
};
this.novo = function() {
this.itemEditar = -1;
var elId;
var elMarca = document.getElementById("add-marca");
var elPlaca = document.getElementById("add-placa");
var elModelo = document.getElementById("add-modelo");
elId.value = this.elId + 1;
elMarca.value = '';
elPlaca.value = '';
elModelo.value = '';
};
this.excluir = function(item) {
this.veiculos.splice(item, 1);
this.listarTodos();
};
}
function fechar() {
document.getElementById("mostrar").style.display = 'none';
};
cadastro.listarTodos();
<html>
<head>
<meta charset="utf-8">
<title>RAD I</title>
</head>
<body>
<form action="javascript:void(0);" method="POST" onsubmit="cadastro.add()">
<input type="text" id="add-placa" placeholder="Placa">
<input type="text" id="add-marca" placeholder="Marca">
<input type="text" id="add-modelo" placeholder="Modelo">
<input type="submit" value="Salvar">
<p>
<input type="text" id="add-placa" placeholder="Placa">
<input type="submit" name="buscar" value="Buscar">
</form>
</body>
</html>