CodeZine(コードジン)

特集ページ一覧

文章の中のはてなキーワードをハイライトさせる

目的に応じて適材適所で使うPHPライブラリ(5)

  • LINEで送る
  • このエントリーをはてなブックマークに追加
2010/03/25 14:00
目次

HTML内の特定の箇所の文章を抜き出す

 HTML内の特定の要素を取り出す、という意味でprototype.jsの$()メソッドを使います。index.html内に新着キーワードを含む文章をサンプルとして書いてdivタグでidを振ります。

index.html(抜粋)
<div id="text">
オタク中野要塞出身の女性タレント。<br />
200x年サッポロビールイメージガールとして活躍、スタイルは抜群。<br />
当初はアイドルユニットでデビューした。<br />
趣味:占い、アニメ、占い、ネイルアート、散歩<br />
特技:HIPHOPダンス、サルサ、ストレッッチ、空手<br />
フジテレビビジュアルクイーンを目指して活動中。
</div>

 上記の例では$('text')でdivタグ内の要素が取得でき、文章は$('text').innerHTMLで取得できます。

抜き出した文章をPHPに送信し、PHP内でキーワードの検出を行う

 $('text')で取り出した要素を形態素解析を行うPHPに送信します。送信先のPHPをreplace.phpとすると、この部分はAjax.Requestを利用して以下のように書けます。

index.html(抜粋)
new Ajax.Request( 
    "./replace.php", 
    { 
        "method": "post", 
        "parameters": "str=" + $('text').innerHTML, 
 # 略
        } 
    } 
);

 Ajax内で取り出した文章を「str」の変数名で「replace.php」へPOSTする意味になります。文章を受け取ったreplace.php内では形態素解析を行い、その結果をAjaxで受け取れるようにXMLで出力する必要があります。はてなキーワードへのリンクは「http://d.hatena.ne.jp/keyword/[エンコード済みのキーワード]」のURLとなりますので、形態素解析を行い、キーワードをハイライトさせる際にこの形式のリンクも追加します。

replace.php(抜粋)
// 文章を受け取る
$_text = $_POST['str'];
// 返却するXML内ではエスケープが必要
$_text = htmlspecialchars($_text);

// 文章の中の新着キーワードを取得
$_keywords = $util->getKeywords($_text);

// 文章の中の新着キーワードをハイライトさせ、はてなキーワードへのリンクを付加
foreach($_keywords as $k=>$v){
    $_link = "<span class=\"highlight\"><a href=\"http://d.hatena.ne.jp/keyword/". urlencode($v) . "\" target=\"_blank\">{$v}</a></span>";
    $_link = htmlspecialchars($_link);
    // キーワードの置換
    $_text = str_replace($v, $_link, $_text);
}
// XMLを出力
header('Content-type: text/xml; charset=UTF-8');
$xml = <<<XML
<replace>
  <text>{$_text}</text>
</replace>
XML;
echo $xml;

 新着キーワードのハイライトはCSSで行うので、spanタグでハイライト用の記述を追加します。XML内ではHTMLタグが使えないため、エスケープを行います。XMLの出力形式は「replace」と「text」の構造としています。


  • LINEで送る
  • このエントリーをはてなブックマークに追加

バックナンバー

連載:目的に応じて適材適所で使うPHPライブラリ

もっと読む

著者プロフィール

  • 山田 祥寛(ヤマダ ヨシヒロ)

    静岡県榛原町生まれ。一橋大学経済学部卒業後、NECにてシステム企画業務に携わるが、2003年4月に念願かなってフリーライターに転身。Microsoft MVP for ASP/ASP.NET。執筆コミュニティ「WINGSプロジェクト」代表。 主な著書に「入門シリーズ(サーバサイドAjax/XM...

  • WINGSプロジェクト 片渕 彼富(カタフチ カノトミ)

    <WINGSプロジェクトについて> 有限会社 WINGSプロジェクトが運営する、テクニカル執筆コミュニティ(代表 山田祥寛)。主にWeb開発分野の書籍/記事執筆、翻訳、講演等を幅広く手がける。2018年11月時点での登録メンバは55名で、現在も執筆メンバを募集中。興味のある方は、どしどし応募頂...

あなたにオススメ

All contents copyright © 2005-2021 Shoeisha Co., Ltd. All rights reserved. ver.1.5