Помогите. Как вывести значения из массива. loadMore. Что я не так делаю?

Question

var dog = [dog_1, dog_2, dog_3, dog_4]

var dog_1 = {
    'foto': 'https://hips.hearstapps.com/hmg-prod.s3.amazonaws.com/images/dog-puppy-on-garden-royalty-free-image-1586966191.jpg?crop=1.00xw:0.669xh;0,0.190xh&resize=1200:*',
    'title': 'This series has now ended. Please feel free to visit our archive programmes which are listed below.',
    'intro': 'Couples should support each other. But, does that mean you need to carry your wife?.'
};

var dog_2 = {
    'foto': 'https://hips.hearstapps.com/hmg-prod.s3.amazonaws.com/images/dog-puppy-on-garden-royalty-free-image-1586966191.jpg?crop=1.00xw:0.669xh;0,0.190xh&resize=1200:*,
    'title': 'This series has now ended. Please feel free to visit our archive programmes which are listed below.',
    'intro': 'Couples should support each other. But, does that mean you need to carry your wife?'
};

var dog_3 = {
    'foto': 'https://hips.hearstapps.com/hmg-prod.s3.amazonaws.com/images/dog-puppy-on-garden-royalty-free-image-1586966191.jpg?crop=1.00xw:0.669xh;0,0.190xh&resize=1200:*',
    'title': 'This series has now ended. Please feel free to visit our archive programmes which are listed below.',
    'intro': 'Couples should support each other. But, does that mean you need to carry your wife?'
};

var dog_4 = {
    'foto': 'https://hips.hearstapps.com/hmg-prod.s3.amazonaws.com/images/dog-puppy-on-garden-royalty-free-image-1586966191.jpg?crop=1.00xw:0.669xh;0,0.190xh&resize=1200:*',
    'title': 'This series has now ended. Please feel free to visit our archive programmes which are listed below.,
    'intro': 'Couples should support each other. But, does that mean you need to carry your wife?'
};



{
    const articles = ["dog_1","dog_2","dog_3","dog_4"];
    function embedElements(){
        var arrayLength = articles.length;
for (var i = 0; i < arrayLength; i++) {
    console.log(articles[i]);
}

articles.forEach(el => {
          document.getElementById('result').innerHTML +=`<div>${el}</div><br />`;
          
       });
    };
 }

<button onclick="embedElements()">loadMore</button>

Answer 1

var dog_1 = {
  'foto': 'https://hips.hearstapps.com/hmg-prod.s3.amazonaws.com/images/dog-puppy-on-garden-royalty-free-image-1586966191.jpg?crop=1.00xw:0.669xh;0,0.190xh&resize=1200:*',
  'title': 'This series has now ended. Please feel free to visit our archive programmes which are listed below.',
  'intro': 'Couples should support each other. But, does that mean you need to carry your wife?.'
};

var dog_2 = {
  'foto': 'https://hips.hearstapps.com/hmg-prod.s3.amazonaws.com/images/dog-puppy-on-garden-royalty-free-image-1586966191.jpg?crop=1.00xw:0.669xh;0,0.190xh&resize=1200:*',
  'title': 'This series has now ended. Please feel free to visit our archive programmes which are listed below.',
  'intro': 'Couples should support each other. But, does that mean you need to carry your wife?'
};

var dog_3 = {
  'foto': 'https://hips.hearstapps.com/hmg-prod.s3.amazonaws.com/images/dog-puppy-on-garden-royalty-free-image-1586966191.jpg?crop=1.00xw:0.669xh;0,0.190xh&resize=1200:*',
  'title': 'This series has now ended. Please feel free to visit our archive programmes which are listed below.',
  'intro': 'Couples should support each other. But, does that mean you need to carry your wife?'
};

var dog_4 = {
  'foto': 'https://hips.hearstapps.com/hmg-prod.s3.amazonaws.com/images/dog-puppy-on-garden-royalty-free-image-1586966191.jpg?crop=1.00xw:0.669xh;0,0.190xh&resize=1200:*',
  'title': 'This series has now ended. Please feel free to visit our archive programmes which are listed below.',
  'intro': 'Couples should support each other. But, does that mean you need to carry your wife?'
};

const articles = [dog_1, dog_2, dog_3, dog_4];

function embedElements() {
  articles.forEach(el => {
    document.getElementById('result').innerHTML += `<div>
    <h2>${el.title}</h2>
    <p>${el.intro}</p>
    <img src="${el.foto}" />
    </div>`;
  });
}

<button onclick="embedElements()">loadMore</button>

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

БЛОГ НА HUSL

Помогите. Как вывести значения из массива. loadMore. Что я не так делаю?

Ответы (1 шт):