JS+XMLDOM+XSL：实现中英文界面切换、排序、分页显示、增删改查XML文件数据源

0. 有关JS、XMLDOM、XSLT的基础知识，可以参考我前面的三篇学习笔记：
《JS学习笔记》
《XML DOM学习笔记(JS) 》
《XSLT学习笔记 》

1. 中英文切换：
    原本打算是用一个XML文件(Language.xml)作为语言的配置文件，然后在HTML/JS中传入所选择得语言种类，来加载不同的XML节点，我最原始的思路：
<!--langg传文件名：zh或en-->

<xsl:param name="langg"></xsl:param>
<xsl:variable name="languag" select="document($filename)/language/$langg"></xsl:variable>

//Language.XML

<?xml version="1.0" encoding="gb2312"?>
<language>
    <zh>
        <title>员工信息</title>
        <btnAdd>新建员工</btnAdd>
        <column1>姓名</column1>
        <column2>部门</column2>
        <column3>备注</column3>
        <column4>删除</column4>
        <CurrentPage>当前页码</CurrentPage>
        <TotelPage>总页数</TotelPage>
        <TotelCount>总记录数</TotelCount>        
        <FirstPage>首页</FirstPage>
        <PrevPage>前一页</PrevPage>
        <NextPage>后一页</NextPage>
        <LastPage>最后一页</LastPage>
    </zh>
    <en>
        <title>Employee Information</title>
        <btnAdd>Add New Employee</btnAdd>
        <column1>Name</column1>
        <column2>Department</column2>
        <column3>Memo</column3>
        <column4>Delete</column4>
        <CurrentPage>Current Page</CurrentPage>
        <TotelPage>Totel Page Count</TotelPage>
        <TotelCount>Totel Record Count</TotelCount>
        <FirstPage>First Page</FirstPage>
        <PrevPage>Previous Page</PrevPage>
        <NextPage>Next Page</NextPage>
        <LastPage>Last Page</LastPage>
    </en>
</language>

    但在实践过程中，发现XSL中document函数后的Xpath不能带参数变量，只好改成两个文件(zh.xml和en.xml)，通过HTML/JS传入所选择的语言的种类，来加载不同的语言所对应的配置文件：

<!--langg传文件名：zh或en-->
<xsl:param name="langg"></xsl:param>
<xsl:variable name="filename" select="concat($langg,'.xml')"></xsl:variable>
<xsl:variable name="languag" select="document($filename)/language"></xsl:variable>

//zh.xml

<?xml version="1.0" encoding="gb2312"?>
<language>
        <title>员工信息</title>
        <btnAdd>新建员工</btnAdd>
        <column1>姓名</column1>
        <column2>部门</column2>
        <column3>备注</column3>
        <column4>删除</column4>
        <CurrentPage>当前页码</CurrentPage>
        <TotelPage>总页数</TotelPage>
        <TotelCount>总记录数</TotelCount>        
        <FirstPage>首页</FirstPage>
        <PrevPage>前一页</PrevPage>
        <NextPage>后一页</NextPage>
        <LastPage>最后一页</LastPage>
        <add>
            <NotNull>员工姓名不能为空！</NotNull>
            <NameRepeat>姓名重复，请重新输入姓名！</NameRepeat>
            <Save>保存</Save>
            <Cancel>取消</Cancel>
            <Title>员工信息</Title>
            <Name>姓名</Name>
            <Dept>部门</Dept>
            <Memo>备注</Memo>
        </add>
        <del>
            <Text1>确定删除 </Text1>
            <Text2> 记录吗？</Text2>
        </del>
        <edit>
        </edit>
</language>

//en.xml

<?xml version="1.0" encoding="gb2312"?>
<language>
        <title>Employee Information</title>
        <btnAdd>Add New Employee</btnAdd>
        <column1>Name</column1>
        <column2>Department</column2>
        <column3>Memo</column3>
        <column4>Delete</column4>
        <CurrentPage>Current Page</CurrentPage>
        <TotelPage>Totel Page Count</TotelPage>
        <TotelCount>Totel Record Count</TotelCount>
        <FirstPage>First Page</FirstPage>
        <PrevPage>Previous Page</PrevPage>
        <NextPage>Next Page</NextPage>
        <LastPage>Last Page</LastPage>
        <add>
            <NotNull>You must enter employee name！</NotNull>
            <NameRepeat>Name is already exists，please input again！</NameRepeat>
            <Save>Save</Save>
            <Cancel>Cancel</Cancel>
            <Title>Employee Information</Title>
            <Name>Name</Name>
            <Dept>Department</Dept>
            <Memo>Memo</Memo>
        </add>
        <del>
            <Text1>Do you confirm to delete </Text1>
            <Text2> record?</Text2>
        </del>
</language>

2. 分页：

//JS中
xslProcessor.addParameter("currentPage", currentPage);
xslProcessor.addParameter("totelPage", GetTotlePage());
xslProcessor.addParameter("totelEmployee", GetTotleEmplyee());
xslProcessor.addParameter("pageSize", pageSize);
//定义要读取的Employee记录的范围
xslProcessor.addParameter("startEmployee", (currentPage-1)*pageSize);
xslProcessor.addParameter("endEmployee", currentPage*pageSize);

//XSL中
xsl中，只读取一定范围的节点(startEmployee<position()<=endEmployee)：
<xsl:for-each select="//employee[position()&gt;$startEmployee and position()&lt;=$endEmployee]">

3. 排序：

//JS中：
xslProcessor.addParameter("order", order);//order是排序依据的列名
xslProcessor.addParameter("scending", scending);//顺序还是倒序，做得很粗糙，尚待完善.
//XSL中
<xsl:sort select="*[name()=$order]" order="{$scending}"/>
//很多文章介绍说可以这样<xsl:sort select="$order" order="{$scending}"/>，但在我自己的机器上测试不行的说

4. 增删查改：基本的XMLDOM操作，直接看代码吧...

数据文件

XSL文件

List.html

Add.html

edit.html

源代码下载：http://files.cnblogs.com/happyhippy/XML.rar(打开list.html查看效果)
现实效果图：
添加(zh):

修改(en):

删除(zh):

删除(en):

5. 没弄过CSS，所以没有做界面美化...

本文转自Silent Void博客园博客，原文链接：http://www.cnblogs.com/happyhippy/archive/2007/07/26/831600.html，如需转载请自行联系原作者