Update

В предыдущем посте я показал как прятать имейлы от спамеров на чистом CSS:

Защита Email от Spamer’ов на CSS
Nojs, only CSS! Да да, No JS Сейчас поведаю про интересный способ защиты имейлов от спамеров используя только CSS. И так, сначала ревертим наш имейл, можем это сделать на JS: ‘major@geekjob.ru’.split(″).reverse().join(″) // ur.bojkeeg@rojam Далее этот имейл вставляем в HTML: <span class=“antib…

Минус такого подхода — при попытке скопировать имейл человеком, он так же перевернут и получется что защита от всех, даже от людей. В комментариях писали что такой метод плох и мы портим жизнь людям. Я согласен, но тут скорее был показан просто сам трюк и его красота. Но если хочется его использовать в продакшене, то его можно проапдейтить с помощью JS.

Суть идеи

Мы копируем имейл во время его выделения, переворачиваем его и кладем в буффер обмена уже перевернутым. От идеи к реализации:

<style>
.antibot {
unicode-bidi: bidi-override;
direction: rtl;
}
</style>
<span class="antibot">ur.bojkeeg@rojam</span>
<span id="copy2cb">↗️</span>

JavaScript

var antibot = document.querySelector('.antibot');
var copy2cb = document.querySelector('#copy2cb');
antibot.onmouseup = doSomethingWithSelectedText;
antibot.onkeyup = doSomethingWithSelectedText;
copy2cb.addEventListener('click', function(){
copyToClipboard(reverse(antibot.innerText))
});
function reverse(s) { return s.split('').reverse().join('') }
function doSomethingWithSelectedText() {
var selectedText = getSelectedText();
if (selectedText) {
selectedText = reverse(selectedText);
console.log(selectedText);
copyToClipboard(selectedText);
}
}
function getSelectedText() {
var text = '';
if (typeof window.getSelection != void 0) {
text = window.getSelection().toString();
}
else if (typeof document.selection != void 0 && document.selection.type == 'Text') {
text = document.selection.createRange().text;
}
return text;
}
function copyToClipboard(text) {
var textarea = document.createElement("textarea");
textarea.textContent = text;
textarea.style.position = "fixed";
document.body.appendChild(textarea);
textarea.select();
try {
return document.execCommand("cut");
} catch (ex) {
console.warn("Copy to clipboard failed.", ex);
return false;
} finally {
document.body.removeChild(textarea);
}
}

Код на JSBin https://jsbin.com/gaxaqocaku/edit?js,output

Идея конечно имеет ряд недостатков, но все же она имеет право на жизнь. Ее можно еще доработать и додумать… Ну или использовать принципиально иной способ с генерацией имейла на JS, как это делают многие. Кстати, в CloudFlare есть опция защиты имейлов на сайте — они автоматически превращаются в JS код с генерацией имейла.