[js]メールアドレスを自動収集されないように表示する

放置してたメールボックスを受信してみたら1000通もスパムが溜まってた。さすがに驚いた。

スパマーはWebサイトに記載されてるメアドをgoogleのクローラのようなbotで拾っていくとか。
直接メアド書くのは最早時代遅れとなりつつあり、お手軽な方法としてはエンティティ化が流行ってる様子。
でも唐突にエンコード文字があると逆に怪しいと思うんだけどどうでしょう。
個人的にはあのクソ長い文字の羅列はあまり好きじゃない。ソフトが勝手にデコードしたりするし。

そこでmailtoリンクつきのメールアドレスをスタイリッシュにjavascriptで表示するサンプルを。
前にmootoolsで書いたけど、今回は普通のjavascriptで。

document.writeではなく、aタグ作って挿入すればソースにはテキストが出ない。
気になるのは外部jsも自動収集されるのか、ということでしょうか。

IDはページに1つしか使えない代わりに割と簡単。

<span id="mt"></span>
window.onload = function() {
 var mLink = document.createElement('a');
 mLink.setAttribute("href", "mailto:hoge@sample.com");
 mLink.innerHTML ="hoge@sample.com";
 var mSpan = document.getElementById("mt");
 mSpan.appendChild(mLink);
}

class。
1番目と3番目に入ります。

<span class="mt"></span>
<span class="st"></span>
<span class="mt"></span>

window.onload = function() {
var Span = document.getElementsByTagName(“span”);
var mSpan = new Array();
var mLinks = new Array();
for (i = 0; i < Span.length; i++) { if(Span[i].getAttribute("class")=='mt'){ mSpan.push(Span[i]); var mLink = document.createElement('a'); mLink.setAttribute("href", "mailto:hoge@sample.com"); mLink.innerHTML ="hoge@sample.com"; mLinks.push(mLink); } } for (n = 0; n < mSpan.length; n++) { mSpan[n].appendChild(mLinks[n]); } } [/js] これらの方法だとjavascriptがOFFだと表示されないし、headにソースを入れたら元も子もない。 で、よく@を別の文字(★とか)に変換するというのがあるが、その方法でメアドを別の書き方にしてjavascirptで置換してみる。 [html] Email:hoge*test+com+jp
Email:hoge*test+com

[/html]
noscriptでjavascriptがoffのメッセージを出す。

window.onload = function() {
var mLink = document.getElementsByTagName(“a”);
for (i = 0; i < mLink.length; i++) { if(mLink[i].getAttribute("rel")=='contact'){ var str = mLink[i].innerHTML; str = str.replace("\*","@"); str = str.split("\+"); var m = str.join("."); mLink[i].setAttribute("href",'mailto:'+m); mLink[i].setAttribute("title","メール送信"); mLink[i].innerHTML="Email:"+m; } } } [/js] 変換する文字はreplaceとsplitを変更すれば別の文字でも出来る。 これならheadに入れてもセーフ?

コメントを残す

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください