0

Когда я нажимаю на кнопку, чтобы высвечивался alert с текстом кнопки. У меня такой код, это правильно, или надо по-другому прописать?

document.addEventListener('DOMContentLoaded', function() {
  let btn = document.getElementById('btn-msg');
  btn.onclick = function() {
    alert('Show message');
  }
  btn.onmouseover = function() {
    event.target.style.background = 'red';
  }
  btn.onmouseout = function() {
    event.target.style.background = ''
  }
});
<button id="btn-msg">Show message</button>
<button id="btn-generate">Generate item</button>
<p><strong id="tag">Tag:</strong></p>
<ul>
  <li>Item 1</li>
  <li>Item 2</li>
</ul>

1 ответ 1

2

В вашем коде присутствует ошибка: необходимо указать обработчикам событий аргумент event там, где это необходимо. Помимо этого, рекомендую выводить текст через this.textContent

document.addEventListener('DOMContentLoaded', function() {
  let btn = document.getElementById('btn-msg');
  btn.onclick = function() {
    alert(this.textContent);
  }
  btn.onmouseover = function(event) {
    event.target.style.background = 'red';
  }
  btn.onmouseout = function(event) {
    event.target.style.background = ''
  }
});
<button id="btn-msg">Show message</button>
<button id="btn-generate">Generate item</button>
<p><strong id="tag">Tag:</strong></p>
<ul>
  <li>Item 1</li>
  <li>Item 2</li>
</ul>

6
  • Хорошо, спасибо, а касательно моего вопроса что-то сказать можете?
    – Matc
    17 фев 2018 в 12:19
  • Вывод текста при клике через onclick - вполне адекватное решение, ничего плохого о нём сказать не могу, так что всё правильно. Разве что можно было воспользоваться addEventListener() для навешивания обработчика. 17 фев 2018 в 12:27
  • Хорошо, я просто думал, а можно ли сделать так, чтобы туда мог выводиться любой текст с этой кнопки в случае если мы заменим текст на кнопке, а в функции прописан неправильный.
    – Matc
    17 фев 2018 в 12:29
  • this.textContent, который я вам показал выше, решает этот вопрос. 17 фев 2018 в 12:30
  • Точно, спасибо огромное!
    – Matc
    17 фев 2018 в 12:32

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.