JavaScript 操作 XML 实例 （获取新闻标题并分页，并分页）

XML 代码部分 这是一个新闻的XML 文件，如果 NBody部分包含 XML 和Html 不可识别部分， 就 包含在DATA 表示附中。

具体内容我没有做测试。仅供参考

<?xml version="1.0" encoding="gb2312"?>
<NEWS>
   <New id="1"  name="测试新闻1" time="2010-2-18">
    <NBody>新闻测试1新闻测试1</NBody>
  </New>
  <New id="2"  name="测试新闻2" time="2010-2-18">
    <NBody>新闻测试2新闻测试2</NBody>
  </New>
  <New id="3"  name="测试新闻3" time="2010-2-18">
    <NBody>新闻测试3新闻测试3</NBody>
  </New>
  <New id="4"  name="测试新闻4" time="2010-2-18">
    <NBody>新闻测试4新闻测试4</NBody>
  </New>
  <New id="5"  name="测试新闻5" time="2010-2-18">
    <NBody>新闻测试5新闻测试5</NBody>
  </New>
  <New id="6"  name="测试新闻6" time="2010-2-18">
    <NBody>新闻测试6新闻测试6</NBody>
  </New>
  <New id="7"  name="测试新闻7" time="2010-2-18">
    <NBody>新闻测试7新闻测试7</NBody>
  </New>
  <New id="8"  name="测试新闻8" time="2010-2-18">
    <NBody>新闻测试8新闻测试8</NBody>
  </New>
  <New id="9"  name="测试新闻9" time="2010-2-18">
    <NBody>新闻测试9新闻测试9</NBody>
  </New>
</NEWS>

JS 代码部分。js部分代码比较简单。 重要的就几XML 操作函数

//JavaScript
function bindNew(index)
{
    var  List = new Array(); 
    List = showPage(index);
    var listul = "<ul style=\" font-size:12px \">"
    for( var i=0 ; i < List.length ; i++)
    {
        //document.getElementById("listTb").innerHTML += List[i]+"</br>";
        listul += "<li style=\" margin-top:4px\">"+ List[i] + "</li>";
    }
    listul += "</ul>";
    document.getElementById("listTb").innerHTML = listul;
    
    document.getElementById("refer").innerHTML = "";
    var tc = rtnPageCount();
    for( var i=1 ; i<=tc ; i++)
    {
        //<div style="14px; height:12px; color:#FFFFFF; background-color:#000000; float:left"></div>
        document.getElementById("refer").innerHTML += "<div style=\"14px; height:14px; color:#FFFFFF; background-color:#000000; float:left; cursor:hand\" onclick=\" bindNew("+i+")\">"+ i +"</div>";
        }
}

var xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
xmlDoc.async = false;
xmlDoc.resolveExternals = false;
xmlDoc.load("News.xml");


// 返回固定 ID 的新闻
function findNew(newid)
{
    var Domelement = xmlDoc.documentElement;
    alert(Domelement);
}
// 返回分页后的新闻标题连接
var pageSize = 40;
function showPage(pageIndex)
{
    var Alltt = new Array();
    Alltt = AlltitleLink();
    var rtLinks = new Array();
    /*未完成部分*/
    try
    {
        for( var i=0 ; i< pageSize && (pageSize*(pageIndex-1)+i)<Alltt.length ; i++)
        { 
           rtLinks[i] = Alltt[pageSize*(pageIndex-1)+i];
            }
     }
     catch(e)
     { alert("showPage() 方法出错 ！"); }
    return rtLinks;    
}
//返分页后的页数
function rtnPageCount()
{
    var countx = getCount();
    if(countx%pageSize == 0)
    {
    return  countx/pageSize ;
    }
    else
    {
        return countx/pageSize + 1 ;
        }
    }

//返回新闻条数
function getCount()
{
    var NewRoot = xmlDoc.documentElement;
    var AllNews = NewRoot.childNodes;
    return AllNews.length;
}

//返回固定条数的新闻标题连接

function returnNews(count)
{
    var titles = new Array();
    var j = 0;
    NewRoot = xmlDoc.documentElement;
    allNews = NewRoot.childNodes;
    for( var i=0 ; i<allNews.length ; i++ )
    {
        if(i >= allNews.lenth)
        {
            titles[j] = "<a herf=\"../News.html?id=" + (i+1) + "\">"+ allNews[i].getArrtibute("name") +"</a>";
            j++;
            }
        }
    return titles;
}

//发回所有新闻 标题的超连接
function AlltitleLink()
{
    var allttLink = new Array();
    var NewRoot = xmlDoc.documentElement ;
    var allNews = NewRoot.childNodes;
    for( var i=0 ; i<allNews.length ; i++ )
    {
        var context = allNews[i];
        allttLink[i] = "<a href=\"../News.html?id="+(i+1)+"\">"+ context.getAttribute("time")+ " : " + context.getAttribute("name") +"</a>";
    }
    return allttLink;
}

部分Html 代码

<table width="90%" border="0" cellspacing="0" cellpadding="0" style="font-size:12px; text-align:left">
          <tr>
            <td><div style="400px; border-bottom:1px dotted #999999; color:#333333; font-weight:bold">全部动态>></div></td>
          </tr>
          <tr>
            <td>
            <div id="listTb" class="listul"></div>            </td>
          </tr>
          <tr>
            <td>
            <div id="refer"></div>            </td>
          </tr>
        </table>

希望对大家的学习工作又所帮助， 欢迎提问反馈