おれ かきすてる おまえ よむ

ぶんたい いろいろ いちにんしょう ばらばら でも それでいい きにするな おまえ つよくいきろ それでいい

はてブロの本文末尾に過去ログ一覧へ飛ぶリンクを付けるJavaScript

を、わりと雑な感じで書いた。JavaScriptが通るって素敵だなあ。

f:id:Sizuken:20140418185321p:plain

もちろんそんなところの要素にidは振ってないので、XPathを使って書いた。XPathの評価式はわかるのだけど、JavaScriptからXPathを使ったことはなかったので色々と時間が掛かってしまったし、鼻も詰まった。鼻風邪かな。

function() {
    var xpath = "//div[@class='categories ']";
    var categories = document.evaluate(xpath, document, null,
         XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null);
    var category = categories.snapshotItem(0).textContent;
        category = category.replace(/\s+/g, "");
    var categoryUrl = "http://sizuken.hateblo.jp/archive/category/" + category;
    
	var ele = document.createElement("a");
        ele.setAttribute("href", categoryUrl);
        ele.setAttribute("class", "endoftext");
	var str = document.createTextNode("#" + category);
        ele.appendChild(str);
    
        xpath = "//div[@class='entry-content']/descendant-or-self::p[last()]"; 
    var targets = document.evaluate(xpath, document, null,
         XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null);
    var target = targets.snapshotItem(0);
        target.appendChild(ele);
};

自分の行動パターン的に、Googleで調べ物→見ず知らずのブログへ辿り着く→目的の記事を読む→なかなかおもしろかったからこの人の書いた他の記事も読みたいな→同じジャンルの記事一覧を見る というのが多い気がしたので、ほんなら記事の一番下の方に同カテゴリの記事一覧置いとけばええやんけ、と思ってこんな形に。

よくある「同じカテゴリの記事一覧」みたいなので画面上に(本文以外の)テキストがわらわら増えるのはちょっと嫌だったし、現状のはてなダイアリーで実現するにはZenbackを使わなきゃいけないのもかなり嫌だった。で、最近、エントリ本文の末尾に::afterでfaviconを置いてるブログをちらほら見掛けて(必要性はわからないけど)それなりにカッコよかったので、若干それっぽくしてみた。

しかしこれだと同じカテゴリの記事の一覧ページに飛びそうな雰囲気がビタ一文出ていないので、UIとしてはクソですね的な感じで怒られそう。でもとにかくテキスト増やしたくないし、どうしたもんかなー。もうちょっといいデザイン思い付いたら直す。

あと、JSが適当すぎて「一番最後のp」しか探索していないとか複数カテゴリの設定に対応してないとかあるけどいつか困る時が来たらなんとかする、というか、いつか困る時が来るまではほっとく。とりあえず今は動けばいい。「はてなブログに戻った理由」でも書いた通り、とにかくこのブログには労力をかけたくない。「はてなブログに戻った理由」はカテゴリの記事一覧から探して読んでね!