查看新闻页

　　当用户点某个新闻分类的标题后，就会跳转到新闻列表页，其中会列出所选新闻分类下的新闻，代码如下：

function populateSingleNews(xml)...{
   ...
   var newDescItem = document.getElementById(categoryA);
   $(newDescItem).click(function() ...{
      showProgress();
      getNews(category.substring(4),populateNewsItems);
   });
   ...
}

 　　我们找到了标签categoryA，这个值其实就是新闻分类标题的id值，即：

<h3><a id="cat_business_a" href="#">Business News</a></h3>

 　　接着，调用showProgress去显示等待进度的图标。

　　还记得我们之前的category变量为'cat_business'么?这里我们用substring(4)方法，取得了实际的分类名，也就是business。

　　这里再次调用了getNews方法，但这次回调的函数是populateNewsItems,稍后会详细介绍。

　　显示新闻标题时的动画效果

　　populateSingleNews方法中的最后一个部分就是当每个分类下有最新新闻时，动画显示其新闻标题的效果，将其内容显示在<p id="cat_business">中，代码如下：

var REFRESH = 'refresh';
...
var ITEM = 'item';
var TITLE = 'title';
...
function populateSingleNews(xml)...{
   ...
   var ind = 0;
   var newsArray = new Array();
   $(xml).find(ITEM).each(function()...{
      var txt = $(this).find(TITLE).text();
      newsArray[ind++] = txt;
   });
   var newItem = document.getElementById(category);
   $(newItem).text(newsArray[0]);
   currentNewsVar.listview(REFRESH);
   animate(newsArray,$(newItem),categoryLi);
}

　　首先通过find()和each方法将XML中的新闻标题(即RSS XML中的title标签中的内容)保存到数组newsArray中。

　　接着将newsArray数组中的第1个元素，也就是最新的一条新闻，通过jQuery的text方法放到<p id="cat_business">标签中去。

　　之后调用jQuery Mobile中封装好的listview的refresh方法，就可以刷新当前目录区域内的内容。

　　最后，调用animate方法，其中传入的参数是newsArray数组，<p id="cat_business">标签和当前目录分类的区域标签(categoryLi='cat_business_d_li')，下面来讲解下如何实现动画效果。