使用XML存儲的用戶個性化配置信息

時間 2019-12-17

標籤使用 xml 存儲用戶個性化配置信息欄目 XML 简体版

原文原文鏈接

最近遇到了一個場景：javascript

一、一個客戶端軟件，須要對其中用戶的個性化偏好進行記錄，可是同一個計算機可能會有多人使用這個軟件，所以軟件須要記錄每一個人的偏好css

二、若是用戶第一次登陸，則須要使用默認的偏好html

所以我設計了下面這個XML文件（PersonalizedConfig.xml），用來保存偏好：java

<?xml version="1.0" encoding="gb2312"?>
<?xml-stylesheet type='text/xsl' href='PersonalizedConfig.xslt'?>
<!DOCTYPE UserConfig PUBLIC "-//Tsybius//UserConfig//EN" "PersonalizedConfig.dtd">
<UserConfig Title="用戶個性化配置參數表">
  <User MemCode="10000001" OperId="10006">
    <Config Key="Config1" Value="testConfigValue1" />
    <Config Key="Config2" Value="testConfigValue2" />
    <Config Key="Config3" Value="testConfigValue3" />
    <Config Key="Config4" Value="testConfigValue4" />
    <Config Key="Config5" Value="testConfigValue5" />
  </User>
  <User MemCode="10000001" OperId="10008">
    <Config Key="Config1" Value="testConfigValueA" />
    <Config Key="Config2" Value="testConfigValueB" />
    <Config Key="Config3" Value="testConfigValueC" />
    <Config Key="Config4" Value="testConfigValueD" />
    <Config Key="Config5" Value="testConfigValueE" />
  </User>
</UserConfig>

其中每一個User元素是一個用戶，MemCode和OperId屬性用做該用戶的惟一標識（即說明該用戶是哪一個機構下的哪一個操做員）。每一個用戶下面，都有多個Config元素，其中包含了Key和Value兩個屬性，每個Config元素說明該用戶一個配置項的設置狀況。api

相關文檔類型定義文件（PersonalizedConfig.dtd）代碼以下：瀏覽器

<!--用戶個性化配置文件DTD校驗-->
<!ELEMENT UserConfig (User)*>
<!ATTLIST UserConfig Title CDATA #IMPLIED>
<!ELEMENT User (Config)*>
<!ATTLIST User MemCode CDATA #IMPLIED>
<!ATTLIST User OperId CDATA #IMPLIED>
<!ELEMENT Config EMPTY>
<!ATTLIST Config Key CDATA #IMPLIED>
<!ATTLIST Config Value CDATA #IMPLIED>

相關樣式文件（PersonalizedConfig.xslt）代碼以下：ui

<?xml version="1.0" encoding="gb2312"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
  <!--用戶個性化配置文件XSLT樣式表-->
  <xsl:output method="html"/>
  <xsl:template match="/">
    <html>
      <head>
        <meta content="zh-cn" http-equiv="Content-Language"/>
        <meta content="text/html; charset=utf-16" http-equiv="Content-Type"/>
        <link type="text/css" rel="stylesheet" href="PersonalizedConfig.css"/>
        <title><xsl:value-of select="UserConfig/@Title" /></title>
        <script type="text/javascript" language="javascript">
          <xsl:text disable-output-escaping="yes">
          <![CDATA[
            //自動刷新
            function myrefresh()
            {
                window.location.reload();
            }
            setTimeout('myrefresh()', 3000); //在這裏指定刷新間隔，單位毫秒
          ]]>
        </xsl:text>
        </script>
      </head>
      <body>
        <div id="content">
          <br />
            <strong><font color="red"><xsl:value-of select="UserConfig/@Title" /></font></strong><br />
          <hr />
            <table>
            <tr>
              <th>用戶編號</th>
              <th>操做員代碼</th>
              <th>配置項1</th>
              <th>配置項2</th>
              <th>配置項3</th>
              <th>配置項4</th>
              <th>配置項5</th>
            </tr>
            <xsl:for-each select="UserConfig/User">
              <tr>
                <td class="textCentered"><xsl:value-of select="@MemCode" /></td>
                <td class="textCentered"><xsl:value-of select="@OperId" /></td>
                <xsl:for-each select="Config">
                  <td class="textCentered"><xsl:value-of select="@Value"/></td>
                </xsl:for-each>
              </tr>
            </xsl:for-each>
          </table>
        </div>
      </body>
    </html>
  </xsl:template>

</xsl:stylesheet>

注意在這個XSLT文件中，包含了自動刷新相關的代碼（3秒刷一次），這樣在用瀏覽器打開XML並的時候，就能夠看到XML文檔的最新數據變動狀況了。spa

XSLT文件使用到的CSS樣式表文件（PersonalizedConfig.css）代碼以下：設計

/* Body style, for the entire document */
body
{
    background: #F3F3F4;
    color: #1E1E1F;
    font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
    padding: 0;
    margin: 0;
}
  
/* Header1 style, used for the main title */
h1
{
    padding: 10px 0px 10px 10px;
    font-size: 21pt;
    background-color: #E2E2E2;
    border-bottom: 1px #C1C1C2 solid; 
    color: #201F20;
    margin: 0;
    font-weight: normal;
}
  
/* Table styles */ 
table
{
    border-spacing: 0 0;
    border-collapse: collapse;
    font-size: 10pt;
}
  
table th
{
    background: #3399FF;
    text-align: center;
    text-decoration: none;
    font-weight: normal;
    padding: 3px 6px 3px 6px;
    width:200px;
}
  
table td
{
    vertical-align: top;
    text-align: center;
    padding: 3px 6px 3px 6px;
    margin: 0px;
    border: 1px solid #3399FF;
    /*background: #66FF33;*/
}
  
.textCentered
{
    text-align: center;
}
  
#content 
{
    padding: 0px 12px 40px 40px; 
}

在IE8.0中打開上面的XML文檔，展現效果以下：code