sb Development Laboratory

| main |

特定のカテゴリーを抜き出してリスト表示する

  • 2006/11/23 Thu 00:00
  • -

特定のカテゴリ−を抜き出してリスト表示する方法の一つにajaxを利用する方法があります。

  1. 表示したいカテゴリーのidを控えておく(「sb.cgi?cid=xx」とかで表示されるxxの数字)
  2. 後述するソースをリスト表示させる部分に挿入する
  3. do_something('{site_cgi}?feed=rss&cid=xxx');の「xxx」の部分を1.で控えた数字に置き換える

<div id="extractedlist">loading...</div>
<script type="text/javascript">
<!--
// == written by Takuya Otani <http://serenebach.net/> ===
// == Copyright (C) 2006 SimpleBoxes/SerendipityNZ Ltd. ==
function createXmlHttp()
{
  var object = null;
  try {
    if (window.XMLHttpRequest) object = new XMLHttpRequest();
  } catch(e) {}
  if (object) return object;
  try {
    object = new ActiveXObject("Msxml2.XMLHTTP");
  } catch(e) {
    try {
      object = new ActiveXObject("Microsoft.XMLHTTP");
    } catch(e) {}
  }
  return object;
}
function Ajax()
{
  this.req = null;
  this.type = 'xml'; // xml or text
  this.method = 'GET'; // GET or POST
  this.async = true;
  return this;
}
Ajax.prototype = {
  onerror : function(status)
  {},
  callback : function(res)
  {},
  post : function(url,data)
  {
    this.method = 'POST';
    this.request(url,data);
  },
  get : function(url,data)
  {
    this.method = 'GET';
    this.request(url,data);
  },
  request : function(url,data)
  {
    var req = this.req = createXmlHttp();
    var self = this;
    this.req.onreadystatechange = function()
    {
      if (req.readyState == 4)
      {
        var stat = req.status;
        if (stat == undefined) stat = 0;
        switch (stat)
        {
        case 0: // for local debugging
        case 200:
          var response = null;
          if (self.type == 'text')
          { // text
            response = req.responseText
            if (Browser.isKHTML)
            {
              var esc = escape(response);
              if (esc.indexOf("%u") < 0 && esc.indexOf("%") > -1)
                response = decodeURIComponent(esc);
            }
          }
          else if (req.responseXML != null)
          { // xml
            response = req.responseXML
          }
          self.callback(response);
          break;
        case 304:
          self.callback();
          req.onreadystatechange = null;
          break;
        default:
          self.onerror(req.status);
        }
      } // end of if (req.readyState == 4)
    } // end of this.req.onreadystatechange
    this.req.open(this.method,url,this.async);
    if (this.method == "POST")
    {
      try {
        this.req.setRequestHeader("Content-Type","application/x-www-form-urlencoded;");
      } catch(e) {}
    }
    if (this.type == 'xml')
    {
      try {
        this.req.overrideMimeType("text/xml");
      } catch(e) {}
    }
    this.req.send(data);
  }
};
function do_something(target)
{
  var ajax = new Ajax();
  ajax.callback = function(res) { display_list(res) };
  ajax.get(target);
}
function display_list(res)
{
  var target = document.getElementById('extractedlist');
  var items = res.getElementsByTagName('item');
  var text = '<ul>';
  for (var i=0,n=items.length;i<n;i++)
  {
    var url = null;
    var title = null;
    for (var j=0,m=items[i].childNodes.length;j<m;j++)
    {
      var child = items[i].childNodes[j];
      if (child.firstChild)
      {
        if (child.tagName == 'link') url = child.firstChild.nodeValue;
        if (child.tagName == 'title') title = child.firstChild.nodeValue;
      }
    }
    if (url && title)
      text = [text,'<li><a href="',url,'">',title,'</a></li>'].join('');
  }
  text = [text,'</ul>'].join('');
  target.innerHTML = text;
}
do_something('{site_cgi}?feed=rss&cid=xxx');
// -->
</script>

  • -
  • -