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 that you have read and understand our privacy policy and code of conduct.

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