Array containing objects created in JavaScript, how to display the contents of the array in an HTML div?

Question

Array containing objects created in JavaScript, how to display the contents of the array in an HTML div?

Navigation

#1 by (1 votes)
#2 by (0 votes)

0

The fact is that I have this function that creates objects of the Person class and stores them in an array. I create it correctly, the problem I have is that I want to show the value of the object created in an HTML div. This is the constructor of the Person class.

class Persona
    constructor(nombre,apellidos,direccion,salarioBruto,salarioNeto){
        this._nombre = nombre;
        this._apellidos = apellidos;
        this._direccion =  direccion;
        this._salarioBruto = salarioBruto;
        this._salarioNeto = salarioNeto;
    }

function crear(){
    var nombreI = document.getElementById('nombre').value;
    var apellidoI = document.getElementById('apellidos').value;
    var direccionI = document.getElementById('direccion').value;

    var salarioBrutoI = document.getElementById('salarioBruto').value;
    var salarioNetoI = document.getElementById('salarioNeto').value;
    var bruto = document.getElementById('salarioBruto').value;
    var retencion = document.getElementById('retenciones').value;
    var neto = bruto*retencion/100;
    document.getElementById('salarioNeto').value = neto;

    personas[personas.length]=new Persona(nombreI,apellidoI,direccionI,salarioBrutoI,neto,retencion);
    console.log(personas);
}

javascript html array objeto

asked by Stewie 19.11.2017 в 18:17

source

2 answers

1

You can write the object directly in your DIV as a string like this:

class Pelota {
  constructor(color, x, y) {
    this._color = color;
    this._x = x;
    this._y = y;
   }
}

const pelota = new Pelota('red', 10, 20);
document.querySelector('#div').innerHTML = JSON.stringify(pelota);

<div id="div"></div>

answered by 19.11.2017 в 18:34

function search by string Problems with serialization

score 0 · Accepted Answer

class Persona {
 constructor(n,e) {
 this.name = n; this.edad = e;
 }
}
var people1 = new Persona("Eduardo", 17),
    div = document.getElementById("getInfo");

for(var props in people1) {
  div.innerHTML += " " + people1[props];
}

#getInfo {
background-color: pink;
border: 2px solid purple;
width: 200px;
height: 200px;
}

<div id="getInfo"></div>