Как объединить эти функции?

Question

[ceo444]

Изучаю JS, хочу сделать простой сайт. У меня есть две функции, которые по определенному запросу в input выдают информацию. Одна выдает фото в один div, другая текст в другой div. Как их объединить, чтобы по запросу в инпут выдавало и фото и текст сразу?

function showMe(value) {
    this.value = value;
    let div = document.querySelector('.randomizer__image');
    if (this.value === 'Пока') {
        div.innerHTML = '';
        div.insertAdjacentHTML('afterbegin', '<img src="https://i1.sndcdn.com/avatars-y0WoMwrEU5V7qvdF-K0ia3Q-t500x500.jpg">');
    } 
}



function showMe(value) {
    this.value = value;
    let div = document.querySelector('.wiki');
    if (this.value === 'Пока') {
        div.innerHTML = '';
        div.insertAdjacentText('afterbegin', 'Привет');
    }
}

Comments

[WbICHA]

this.value = value

Зачем?
И почему функции называются одинаково?

[ceo444]

WbICHA, можете поконкретнее объяснить?

<input type="text" onchange="showMe(value)" placeholder="Имя">

Answer 1

[vadim2syr]

let input = document.querySelector(".clickOnMe");
input.onclick = function() { 
    showMePic(this.value);
    showMeText(this.value);
};

Например - так, только поменять названия функций.
Или же упростить собственный код до одной функции:

function showMe(value) {
    if (value === 'Пока') {
        let divImg = document.querySelector('.randomizer__image');
        let divText = document.querySelector('.wiki');
        divImg.innerHTML = '';
        divImg.insertAdjacentHTML('afterbegin', '<img src="https://i1.sndcdn.com/avatars-y0WoMwrEU5V7qvdF-K0ia3Q-t500x500.jpg">');
        divText.innerHTML = '';
        divText.insertAdjacentText('afterbegin', 'Привет');
    };
};

Comments

[ceo444]

Попробовал 2й вариант, все равно не работает почему-то

[vadim2syr]

ceo444, попробуй прочитать эту статью, пригодится в будущем. Там точно есть ответ на твой вопрос в первых абзацах.
https://learn.javascript.ru/events-change