Как скрыть последние 3 знака номера телефона и показать их при нажатии на кнопку показать?

Question

[Мариана Марианова]

Изначально так нажимаем показать - показывается полностью

Answer 1

[0xD34F]

<div class="phone">8 [phone]</div>
<div class="phone">8 [phone]</div>
<div class="phone">8 [phone]</div>

document.querySelectorAll('.phone').forEach(n => {
  const phone = n.innerHTML;
  n.innerHTML = phone.slice(0, -4) + '... - <span>показать</span>';
  n.querySelector('span').addEventListener('click', () => n.innerHTML = phone);
});

Comments

[Вова Дружаев]

а скрипт точно так быстро загрузится? А если медленный инет (3g) - но страница уже начала показываться?

[0xD34F]

Владимир Дружаев, да наплевать. Какой вопрос - такой ответ.

[Fourgotten]

0xD34F, я так понял, что человеку важно чтобы номера не парсили спамеры, данный скрипт не спасет от этого
Но опять же да, какой вопрос, такой и ответ

Answer 2

[Adamos]

Сначала стоит подумать - зачем это делать.
Например, ботам "скрытие" джаваскриптом абсолютно похрен, а защищаются обычно от них.
Более того - если телефон действительно надо показать только реальному человеку и не показать парсерам, телефона в данных страницы вообще быть не должно. По нажатию может происходить запрос к серверу, проверка благонадежности того, кто запрашивает - и только если она успешна, выдача последних цифр и подстановка их в страницу.