JavaScript DOM: как мне указать JS создать элемент (‘p’), который говорит что-то в соответствии со значением в массиве json?

#javascript #arrays #json #if-statement

#javascript #массивы #json #if-оператор

Вопрос:

как мне указать JS для createElement(‘p’), который говорит survived, если значение логического массива в JSON говорит «1», а если оно говорит «0», чтобы сказать deaded? ** Мне нужно, чтобы он создал элемент p с надписью «survived», если значение «survived» в JSON говорит 1 или «deaded», если оно говорит 0. Это один из многих людей в JSON:

 'use strict';
let passengers = [{
        "PassengerId": 1,
        "Survived": 0,
        "Pclass": 3,
        "Name": "Braund, Mr. Owen Harris",
        "Sex": "male",
        "Age": 22,
        "SibSp": 1,
        "Parch": 0,
        "Ticket": "A/5 21171",
        "Fare": 7.25,
        "Cabin": "",
        "Embarked": "S"
    },
//this is my DOM js:

 'use strict';
const seccCards = document.querySelector('#sctCards');
const inputFiltro = document.querySelector('#txtFiltro');
const imprimirCards = () => {
    seccCards.innerHTML = '';
    let filtro = inputFiltro.value.toLowerCase();
    passengers.forEach(obj_passenger => {
        if (obj_passenger.Name.toLowerCase().includes(filtro) || obj_passenger.PassengerId.toLowerCase().includes(filtro)) {
            let card = document.createElement('div');
            card.classList.add('card');
            let passengerbeen = document.createElement('h2');
            passengerbeen.innerText = obj_passenger.Name;
            let passengerF = document.createElement('p');
            if (obj_passenger.Survived == 1) {
                passengerF = sobrevivio;
            } else {
                passengerF = fallecido;
            }
            passengerF.innerHTML = obj_passenger.Survived;

            card.appendChild(passengerbeen);
            card.appendChild(passengerF);
            seccCards.appendChild(card);
        }

    });
};
inputFiltro.addEventListener('keyup', imprimirCards);
imprimirCards();


  

Ответ №1:

Вы можете использовать простой оператор if с переменной. Если они сохранились, установите для переменной значение "survived" , в противном случае установите для нее значение "deceased" . Вместо того, чтобы устанавливать p напрямую, установите для него innerHTML на основе переменной.

 let passengerF = document.createElement('p');
let survivalStatus;
if (obj_passenger.Survived == 1) {
    survivalStatus = "sobrevivio";
} else {
    survivalStatus = "fallecido";
}
passengerF.innerHTML = survivalStatus;