#navi(../)

dojoでRSSフィードを表示するを改造してみた。

有限会社 ウィス - RSSフィードを表示する (XmlStore) external_linkを少し改造してみた。マウスオーバーで、ツールチップでdescriptionの内容が表示される。

dijit.tooltipは、なんらかの方法で既にHTMLとして出力されているid属性にしかアクセスできないので、innerHTMLなど、でRSSフィードをHTMLに書き込んだ後、別のforループを使ってTooltipを出力する。注意したいのは、dojox.data.XmlStore external_linkで作成した変数はオブジェクト型なので、.toString()で文字列に変換するところと、desciptionタグには改行が含まれるので
に変換することである。

#code(javascript)
function rsslist(opts) {

	var settings = { url:'', rootItem: "item", count: 5 };
	//option target:'_blank' count:5
	if (opts) for (var k in opts) settings[k] = opts[k];
	var store = new dojox.data.XmlStore({url: settings.url, rootItem: settings.rootItem});
	var gotFeeds = function(items, request){
		var target;
		var info = [];
		var buffer = ["<ul>"];
		if (settings.target) target = ' target="'+settings.target+'"';
		for (var i = 0; i < items.length; i++){
			var item = items[i];
			var target_id = settings.entryclass + '_item_' + i;
			var title = store.getValue(item, "title").toString();
			var url = store.getValue(item, "link").toString();
			var desc = store.getValue(item, "description").toString().replace('\n', '<br />');	/*改行を<br />に変換して納める */
			if (desc != '') info.push([target_id,desc]);
			
			buffer.push('<li><a id="' + target_id + '" href="' +url + '" ' + target + '>' +title + '</a></li>');
		}
		buffer.push("</ul>");
		dojo.byId(settings.entryclass).innerHTML = buffer.join("");

		/* descriptionをツールチップで表示 */
		for (var j=0; j < info.length; j++){
			new dijit.Tooltip({
				connectId: [info[j][0]],
				label: info[j][1]
			});
		}
	}
	var request = store.fetch({onComplete: gotFeeds, count:settings.count});

}
}}

:書式|

rsslist({
	url:[RSSファイル（必修）],
	entryclass:[表示先のID（必修）],
	rootItem: [ルート要素],
	count: [表示するフィード数],
	target:[ターゲット]
});

:使用例|

<button onclick="rsslist({url:'test.rss',entryclass:'store'});">test.rss取得</button> 
<div id="store">ここが、test.rssに置き換わる</div>