讓IE6打開RSS不顯示代碼(xslt學習)

最近項目開發過程中導師讓我做個RSS訂閱的功能,經過幾番辛苦過後是終於可以了,但是令人很失望的是用IE6瀏覽的時候卻不像IE8裏面顯示的那樣,在IE6裏全部是xml代碼。最後終於是找到了最好的解決方案:通過xslt來將xml轉義成xhtml。轉入正題看如何轉義....

xml文件裏面的內容爲:

<?xml version="1.0" encoding="utf-8"?>

<?xml-stylesheet type=/"text/xsl/" href=/"RSS.xsl/"?>
<rss version="2.0">
  <channel>
    <title>福建省企業上市信息管理平臺</title>
    <link>http://192.168.1.124</link>
    <description>福建省企業上市信息管理平臺</description>
    <copyright>Copyright@鑫信邁系統集成有限公司</copyright>
    <item>
      <title>首頁</title>
      <link>http://192.168.1.124/HtmlDir/index.htm</link>
      <description><![CDATA[福建省企業上市信息管理平臺:首頁]]></description>
      <category>主頁菜單導航</category>
    </item>
    <item>
      <title>信息動態</title>
      <link>http://192.168.1.124/HtmlDir/Pages/NewsList.aspx</link>
      <description><![CDATA[福建省企業上市信息管理平臺:信息動態]]></description>
      <category>主頁菜單導航</category>
    </item>
    <item>
      <title>政策法規</title>
      <link>http://192.168.1.124/HtmlDir/Pages/Policy.aspx</link>
      <description><![CDATA[福建省企業上市信息管理平臺:信息動態]]></description>
      <category>主頁菜單導航</category>
    </item>
    <item>
      <title>互動交流</title>
      <link>http://192.168.1.124/HtmlDir/Pages/PublicMsg.aspx</link>
      <description><![CDATA[福建省企業上市信息管理平臺:互動交流]]></description>
      <category>主頁菜單導航</category>
    </item>
    <item>
      <title>綜合分析</title>
      <link>http://192.168.1.124/HtmlDir/Pages/FullAnalysis.aspx</link>
      <description><![CDATA[福建省企業上市信息管理平臺:綜合分析]]></description>
      <category>主頁菜單導航</category>
    </item>
    <item>
      <title>企業數據庫</title>
      <link>http://192.168.1.124/HtmlDir/Pages/EnterpriseHouse.aspx</link>
      <description><![CDATA[福建省企業上市信息管理平臺:企業數據庫]]></description>
      <category>主頁菜單導航</category>
    </item>
    <item>
      <title>管理平臺</title>
      <link>http://192.168.1.124/SubModule/Login.aspx</link>
      <description><![CDATA[福建省企業上市信息管理平臺:管理平臺]]></description>
      <category>主頁菜單導航</category>
    </item>

</channel>

</rss>

在xml裏先要添加這句<?xml-stylesheet type=/"text/xsl/" href=/"RSS.xsl/"?> 這個是爲了告訴瀏覽器“我這個要轉義呢”於是瀏覽器就找到RSS.xsl文件來進行轉義了。

以下是RSS.xsl文件的代碼

<?xml version="1.0" encoding="utf-8"?>

<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">

  <xsl:template match="/">
    <html>
      <head runat="server">
        <title>RSS</title>
        <style type="text/css">
          body
          {
          font-size:13px;
          font-family:Arial;
          }
          #main
          {
          }
          #content
          {
          float:left;
          width:80%;
          margin-left:15px;
          }
          #content ul
          {
          list-style-type:none;
          padding:0;
          margin-left:0;
          }
          # content ul li
          {
          padding:0;
          margin:0;
          }
          .li_time
          {
          font-size:12px;
          color:Gray;
          margin-bottom:5px;
          vertical-align:middle;
          }
          .li_hr
          {
          margin:0px;
          padding:0;
          }
          .li_title
          {
          font-size:16px;
          font-weight:bold;
          color:Blue;
          }
          .li_title a
          {
          font-size:20px;
          font-weight:bold;
          color:#3165C6;
          text-decoration:none;
          }
          .li_title a:hover
          {
          font-size:20px;
          font-weight:bold;
          color:#5E80FA;
          }
          .li_desc
          {
          margin-bottom:40px;
          }
          #menu
          {
          right:10px;
          top:10px;
          width:18%;
          position:absolute;
          }
          #menu ul
          {
          list-style-type:none;
          margin:0;
          padding:0;
          }
          #title
          {
          width:80%;
          background-color:#FFFFC6;
          margin-left:15px;
          margin-bottom:40px;
          }
          #title ul
          {
          list-style-type:none;
          padding:0;
          margin-left:10px;
          }
          #title ul li
          {
            margin-bottom:10px;
          }
          .myHr
          {
          color:#3165C6;
          height:1px;
          }
        </style>
      </head>
      <body>
        <div>
          <div id="main">
            <div id="title">
              <ul>
                <li class="li_title">
                  <a>

                    <xsl:attribute name="href">
                     
                      <xsl:value-of select="rss/channel/link"/>
                    </xsl:attribute><xsl:value-of select="rss/channel/title"/>
                   
                  </a>
                </li>
               
              </ul>
            </div>

            <div id="content">
              <ul>
                <xsl:for-each select="rss/channel/item">
                  <li class="li_title">
                    <a>
                      <xsl:attribute name="href">
                        <xsl:value-of select="link"/>
                      </xsl:attribute>
                     
                      <xsl:value-of select="title"/>
                    </a>
                  </li>
                  <li class="li_hr">
                    <hr class="myHr" />
                  </li>
                  <li class="li_time">
                    <xsl:value-of select="pubDate"/>
                    <xsl:element name="IMG">                   
                      <xsl:attribute name="SRC">../images/arrow.jpg</xsl:attribute>
                      <xsl:attribute name="style">
                        cursor:pointer;
                      </xsl:attribute>
                      <xsl:attribute name="onclick">
                        javascript:window.location.href="<xsl:value-of select="link"/>";
                      </xsl:attribute>
                    </xsl:element>
                   
                  </li>
                  <li class="li_desc">
                    <xsl:value-of select="description"/>
                  </li>
                </xsl:for-each>
              </ul>
            </div>
            <div id="menu">

              <!--<ul>
                <xsl:for-each select="rss/channel/item">
                  <xsl:sort select="category"/>
                <li>
                  <xsl:value-of select="category"/>
                </li>
                </xsl:for-each>
              </ul>-->
            </div>
          </div>

        </div>
      </body>
    </html>
  </xsl:template>
</xsl:stylesheet>
這裏是一個模仿IE8 SS樣式的,至於IE8裏面的右側類別欄,想了好久找不到好的解決方案也就沒做了,其實也沒必要做。

這裏面有添加超鏈接的,也有添加圖片的,還有給圖片添加樣式,添加onclick的方法的代碼,感覺做完這個後收穫很多 自己mark下,以後肯定用得上。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章