<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<title>Document</title>
</head>
<body>
<div class="div">
<a href="javascript:;" class="phone_number">+7 (495) 118-26-47</a> <span class="phone_show">Показать</span>
</div>
<div class="div">
<a href="javascript:;" class="phone_number">+7 (495) 853-85-32</a> <span class="phone_show">Показать</span>
</div>
<script>
$(function(){
var phone_number = $('.phone_number');
var link = $('.phone_number').attr('href');
var button = $('.phone_show');
var number = phone_number.text();
symbolsForHide = 10;
function hide_phone(){
$('.phone_number').text(number.replace(new RegExp('(.+).{'+symbolsForHide+'}$'),"$1"+'...'));
}
console.log(number);
button.click(function(){
$(this).siblings('.phone_number').text(number);
$(this).siblings('.phone_number').attr('href', 'tel:' + number);
$(this).remove();
});
hide_phone();
})
</script>
</body>
</html>
const reg = new RegExp(`(.+).{${symbolsForHide}}$`);
$('.phone_number')
.attr('data-phone', function() {
return $(this).text()
})
.text((i, text) => text.replace(reg , '$1...'));
const
$this = $(this),
$phone = $this.siblings('.phone_number'),
phone = $phone.data('phone');
$phone.text(phone).attr('href', `tel: ${phone}`);
$this.remove();
hide_phone();
$('.phone_number').each(function(){
$(this).text(number.replace(new RegExp('(.+).{'+symbolsForHide+'}$'),"$1"+'...'));
});