I. В чём проблема
Если социальная сеть, платформа для блогов или форум предоставляют возможность размечать текст при помощи HTML или BBCode, перечёркивать или подчёркивать текст не составляет труда: можно пользоваться тегами s и u обеих разметок или назначать стили в HTML. Но что делать, если у нас есть только голый текст? Или, например, нам нужно зачеркнуть/подчеркнуть слово в заголовке страницы, отображаемом в заголовке вкладки или всего браузера, или оформить слово в заголовке поста в блоге или форуме, где не работает разметка?
Можно рискнуть и воспользоваться средствами Юникода.
II. Нужные символы
Богатство Юникода содержит разнообразные способы создания композитных знаков, но мы упомянем три символа, удовлетворяющие нашу потребность в большинстве случаев.
1. Зачёркивание. Символ Юникода под номером U+0336 (в десятеричной нотации 822). В статье по ссылке можно увидеть и другие, более экзотические виды зачёркивания с соответствующими символами, но нам пока хватит и такого, тем более что он наиболее симулирует эффект привычных тегов. Если вставить по такому символу после каждого знака в тексте, ̶в̶ы̶г̶л̶я̶д̶е̶т̶ь̶ ̶э̶т̶о̶ ̶б̶у̶д̶е̶т̶ ̶в̶о̶т̶ ̶т̶а̶к̶ ̶ (для пущей убедительности лучше прихватывать дополнительные обрамляющие пробелы).
2. Пунктирное подчёркивание. Символ Юникода под номером U+0331 (в десятеричной нотации 817). Подчёркнутый им текст в̱ы̱г̱л̱я̱д̱и̱т̱ ̱в̱о̱т̱ ̱т̱а̱к̱.
3. Почти сплошное подчёркивание. Символ Юникода под номером U+0332 (в десятеричной нотации 818). Подчёркнутый им текст в̲ы̲г̲л̲я̲д̲и̲т̲ ̲в̲о̲т̲ ̲т̲а̲к̲.
III. Как вводить вручную
В разных операционных системах есть разные способы. Некоторые перечислены в этой статье. Обратите внимание на упомянутый там ключ реестра. Судя по моему опыту, в разных приложениях работают разные способы: в одних работал шестнадцатеричный метод, в других десятеричный. Потестируйте сами после редактирования реестра и перезагрузки. Вот нужные нам три кода (в случае шестнадцатеричных кодов первый плюс означает одновременное нажатие, второй — собственно плюс на цифровой клавиатуре; ноль, судя по тестам, можно набирать или пропускать по вкусу):
1. Зачёркивание: Alt + +(0)336 или Alt + (0)822
2. Пунктирное подчёркивание: Alt + +(0)331 или Alt + (0)817
3. Почти сплошное подчёркивание: Alt + +(0)332 или Alt + (0)818
IV. Сетевые сервисы автоматизации
Пользователи давно уже догадались об этой возможности и наплодили множество сервисов, услужливо подсказываемых поиском. Вот простой отечественный пример. А вот зарубежный пример с расширенным выбором.
V. Букмарклеты
Впрочем, пользоваться для такой простой вещи целым сайтом не очень удобно. На помощь могут прийти кросбраузерные букмарклеты. Я попробовал написать два типа: простой, но с более широкой поддержкой браузеров, и посложнее, для последних версий браузеров.
1. Оформление всего текста в любом активном текстовом поле
Достаточно совсем простого кода:
(function(e){
e = document.activeElement;
e.value = e.value.replace(/(.)/g, '$1u0336');
})()
Можете сохранить букмарклеты c этим кодом у себя в закладках. Работает даже на IE8.
Зачеркнуть всё:
javascript:(function(e){e=document.activeElement;e.value=e.value.replace(/(.)/g,'$1u0336');})()
Подчеркнуть всё пунктиром:
javascript:(function(e){e=document.activeElement;e.value=e.value.replace(/(.)/g,'$1u0331');})()
Подчеркнуть всё почти сплошной линией:
javascript:(function(e){e=document.activeElement;e.value=e.value.replace(/(.)/g,'$1u0332');})()
Или перетащите отсюда.
2. Оформление выделенного текста в любом активном текстовом поле
Код усложняется, потому что мы пытаемся оформить только выделенный участок, восстановить точку фокуса и позицию прокрутки:
(function(e,t,s1,st,s2,sy,sx){
e = document.activeElement;
t = e.value;
s1 = e.selectionStart;
s2 = e.selectionEnd;
st = t.substring(s1, s2).replace(/(.)/g, '$1u0336');
sy = e.scrollTop;
sx = e.scrollLeft;
e.value = t.substring(0, s1) + st + t.substring(s2, t.length);
e.selectionStart = e.selectionEnd = s1 + st.length;
e.scrollTop = sy;
e.scrollLeft = sx;
e.focus();
})()
Можете сохранить букмарклеты c этим кодом у себя в закладках. Тестировалось в последнем Firefox, но по идее должно работать и в других браузерах последних версий.
Зачеркнуть выделенное:
javascript:(function(e,t,s1,st,s2,sy,sx){e=document.activeElement;t=e.value;s1=e.selectionStart;s2=e.selectionEnd;st=t.substring(s1,s2).replace(/(.)/g,'$1u0336');sy=e.scrollTop;sx=e.scrollLeft;e.value=t.substring(0,s1)+st+t.substring(s2,t.length);e.selectionStart=e.selectionEnd=s1+st.length;e.scrollTop=sy;e.scrollLeft=sx;e.focus();})()
Подчеркнуть выделенное пунктиром:
javascript:(function(e,t,s1,st,s2,sy,sx){e=document.activeElement;t=e.value;s1=e.selectionStart;s2=e.selectionEnd;st=t.substring(s1,s2).replace(/(.)/g,'$1u0331');sy=e.scrollTop;sx=e.scrollLeft;e.value=t.substring(0,s1)+st+t.substring(s2,t.length);e.selectionStart=e.selectionEnd=s1+st.length;e.scrollTop=sy;e.scrollLeft=sx;e.focus();})()
Подчеркнуть выделенное почти сплошной линией:
javascript:(function(e,t,s1,st,s2,sy,sx){e=document.activeElement;t=e.value;s1=e.selectionStart;s2=e.selectionEnd;st=t.substring(s1,s2).replace(/(.)/g,'$1u0332');sy=e.scrollTop;sx=e.scrollLeft;e.value=t.substring(0,s1)+st+t.substring(s2,t.length);e.selectionStart=e.selectionEnd=s1+st.length;e.scrollTop=sy;e.scrollLeft=sx;e.focus();})()
Или перетащите отсюда.
VI. Подводные камни
Нужно учитывать, что данный метод влечёт за собой некоторые рискованные последствия.
1. Текст, размеченный таким образом, не будет находиться ни сетевым поиском, ни поиском по странице. Также он может создавать проблемы при разных автоматических обработках текста и проверке орфографии.
2. Если используется основной шрифт, в котором нет нужных символов, возможны уродливые глюки разной степени нечитабельности.
3. Некоторые версии браузеров вообще отказываются видеть в этих символах нужные знаки Юникода. Возможны глюки как на стадии создания первоначального текста, так и при перепостах и цитировании.
В общем, будьте осторожны, тестируйте и проверяйте.
Буду благодарен за дополнения и исправления.
Автор: vmb
