べつになんでもないこと

よく貼るリンクにアイコンが表示されるようにしたら大変なことにｗ

これは全部私が悪いわけで、本来アイコンを表示するリンクはクラスを別に設定するべきなのですが、それだと昔の記事のリンクまでクラスを書き加えないといけないのでデフォルトにアイコンを設定してしまいました。

分かっていたとは言えこれは酷いｗ
というわけで、クラスを設定する以外の手段でなんとかすることにしました。

ここから先はPDFをGoogle docs Viewer経由で開くアイコンを挿入してみた（以下スクリプトの名前を「PDFgd」と略します）を使ってる人にしか関係ない話になります。

最初の画像を少し解説すると、PDFgdで置き換えられたリンクをブログに貼ってブログを表示したら、PDFgdで再度置き換えが発生してアイコンが増えたところに、docs.google.comとadobe.comのfaviconが挿入されてカオス状態になったものですｗ

それとサイトによっては元のリンクを表すアイコンが変な位置に表示されてしまう のでそれも修正してみました。

このスクリプトは、PDF/PPT/TIFのリンクをGoogle docsで開くように書き換え、書き換え前のリンクをPDFアイコンで表示するものです。参考：PDFの表示あれこれ

// ==UserScript==
// @name           PDF/PPT/TIF viewer with Google docs
// @namespace      http://puppet.asablo.jp/blog/2010/03/22/4964699
// @include        http://*
// @exclude        http://docs.google.com/*
// ==/UserScript==
// Based on script by Koonies (http://d.hatena.ne.jp/Koonies/): http://userscripts.org/scripts/show/59557

(function(){
  if (location.href.indexOf("http://docs.google.com/") == -1) {
    var l = document.getElementsByTagName("a");
    var i = l.length;
    while (i--) {
      if ((l[i].href.match(/^[^?]+\.(pdf|ppt|tif)$/))
       && (l[i].href.indexOf("http://b.hatena.ne.jp/entry/") == -1)
       && (l[i].className != 'ujspdflk')) {
	var logo = document.createElement("img");
	logo.src = 'data:image/gif;base64,R0lGODlhEAAQAPMAAACh6P///3BvbtpEQt+Wld5+fNQqJ+PIxu/X1tqwrq49O9doZsfHx6RST4eHh/Dp6SH5BAEAAAAALAAAAAAQABAAAARbEMhJqxQ4a0xF+GDICJMXnsx4nQFSICAJmCFREPF6HgP+ybTQ4JCbsQIGAzEAZCUIhOFDgDCeConAIKkoWEOLxWBBSCgI309hgC3SeANYCJgxKBqOjYwSrVoAEQA7';
	logo.border = 0;
	logo.style.margin = '0';
	logo.style.padding = '0';
	var orgpdf = document.createElement("a");
	orgpdf.href = l[i].href;
	orgpdf.className = 'ujspdflk';
	orgpdf.insertBefore(logo, orgpdf.firstChild);
	l[i].href = 'http://docs.google.com/viewer?url=' + l[i].href;
	l[i].target = '_blank';
	l[i].parentNode.insertBefore(orgpdf, l[i].nextSibling);
      }
    }
  }
})();

10.05.01 Firefox 3.5以降用の高速(querySelector)版もあります。

そもそも元の考え（PDFgdで変換したリンクを貼るということ）が間違っていますので、対処も間違った方法（クラスが「ujspdflk」なら置き換えない）で訂正してます。

あとはブログのCSSで「ujspdflk」のクラスにアイコンを表示しないようにするだけです。
.msg-body a.ujspdflk{background:none;padding:0;}

余計なこと（クラスを指定）するなというなら

      if ((l[i].href.match(/^[^?]+\.(pdf|ppt|tif)$/))
       && (l[i].href.indexOf("http://b.hatena.ne.jp/entry/") == -1)
       && (l[i].className != 'ujspdflk')) {
を
      if ((l[i].href.match(/^[^?]+\.(pdf|ppt|tif)$/))
       && (l[i].href.indexOf("http://b.hatena.ne.jp/entry/") == -1)) {
に修正して
	orgpdf.className = 'ujspdflk';
の行を削除します。

さらにはてなブックマークにPDFが登録されると困ったりの対処が不要なら

      if ((l[i].href.match(/^[^?]+\.(pdf|ppt|tif)$/))
       && (l[i].href.indexOf("http://b.hatena.ne.jp/entry/") == -1)) {
を
      if (l[i].href.match(/^[^?]+\.(pdf|ppt|tif)$/)) {
に修正します。

それと、Google Docsを別タブで開くのが嫌な場合
　　　　l[i].target = '_blank';
を削除します。

ちなみに実際に使ってるソースではブログに貼ることを考えて
logo.src ='http://puppet.asablo.jp/blog/img/2010/03/22/ef6b9.gif';
としています（元から間違ってるのでのでキニシナイｗ）


余談ですが、アイコンの表示位置がおかしくなる件がCSSのmarginによるもの（念のためpaddingも0にするようにしました）だと気が付くまでにずいぶん試行錯誤してしまいました。orz

おかげでstyleの記述が微妙に違うと知ったので覚書（でも多分もう使わないｗ）
hoge.style.height = '16px'、.style.marginLeft、.style.backgroundImageとか
orgpdf.appendChild(document.createTextNode("～"));でテキストが挿入できたり知らないことがたくさん。

あと、クラスの指定（上のスクリプト内className）も予約語とかぶるので違ってたりと、知らないと大変だったり。


というわけで間違いだらけの対処法でしたが、最後に一言。

最大の間違いは知りもしないJavaScriptをいじってることですね。

ええ分かってます。私しか使ってないでしょうからこれでいいんです（爆）