簡單的XSLT使用jQuery/JavaScript的

我有這樣的：簡單的XSLT使用jQuery/JavaScript的

<Item name="Alpha"> 
    <Field name="CreationDateTime">2012-04-26</Field> 
    <Field name="Material" readOnly="X"> Congress </Field> 
</Item> 
<Item name="Beta"> 
    <Field name="CreationDateTime">2012-05-26</Field> 
    <Field name="Material" readOnly="X"> Democracy </Field> 
</Item> 
    . 
    . 
    . 
and so on...

而且我希望它在這個格式被轉換：

<Item name="Alpha"> 
    <CreationDateTime >2012-04-26</CreationDateTime> 
    <Material readOnly="X"> Congress </Material> 
</Item> 
<Item name="Beta"> 
    <CreationDateTime >2012-05-26</CreationDateTime> 
    <Material readOnly="X"> Democracy </Material> 
</Item> 
    . 
    . 
    . 
and so on...

我需要在客戶端做這個方面（即在JavaScript和jQuery中）。我可以使用一個jQuery插件（例如Google的AJAXSLT）。問題是 - 我從來沒有做過XSLT（並且也使用javascript！），並且不知道如何去做。

來源

2012-10-05 Tintin

問題是 - 我從來沒有做過XSLT之前（也使用JavaScript！），並沒有線索如何去做。

XSLT是一種用於將XML文檔轉換爲其他文檔（主要是XML，也包括HTML，純文本等）的語言。你需要的是一個輸入XML，在這個輸入上工作，應該在輸入上應用一個轉換來獲得輸出，以及一個XSLT處理器來完成它。

XSLT處理器可以是工具，庫，框架或操作系統提供的一些功能，或者在這種情況下（通過JavaScript來實現）瀏覽器。

您已經擁有XML輸入，因此您需要處理器和轉換。不幸的是，處理器是瀏覽器特定的（例如，用於Mozilla的XSLTProcessor，用於IE的ActiveX等），並且您需要編寫代碼來測試您正在使用的特定瀏覽器（如可以看到in the source code of this page for example）。

幸運的是，您不必這樣做，因爲您提到的JavaScript AJAXSLT之類的JavaScript庫會隱藏下面的詳細信息並公開一個可跨瀏覽器使用的統一API。所以現在你只需要編寫一個XSL文件來完成轉換。

根據您的樣品，如果輸入的是這樣的：

<?xml version="1.0" encoding="UTF-8"?> 
<Items> 
    <Item name="Alpha"> 
     <Field name="CreationDateTime">2012-04-26</Field> 
     <Field name="Material" readOnly="X">Congress</Field> 
    </Item> 
    <Item name="Beta"> 
     <Field name="CreationDateTime">2012-05-26</Field> 
     <Field name="Material" readOnly="X">Democracy</Field> 
    </Item> 
</Items>

有這樣一個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="/"> 
     <Items> 
      <xsl:apply-templates /> 
     </Items> 
    </xsl:template> 

    <xsl:template match="Item"> 
     <Item> 
      <xsl:attribute name="name"> 
       <xsl:value-of select="@name" /> 
      </xsl:attribute> 
      <xsl:apply-templates /> 
     </Item> 
    </xsl:template> 

    <xsl:template match="Field"> 
     <xsl:variable name="fieldName" select="@name" /> 
     <xsl:element name="{$fieldName}"> 
      <xsl:if test="@readOnly"> 
       <xsl:copy-of select="@readOnly" /> 
      </xsl:if> 
      <xsl:value-of select="." /> 
     </xsl:element> 
    </xsl:template> 
</xsl:stylesheet>

你會得到這樣的：

<?xml version="1.0" encoding="UTF-8"?> 
<Items> 
    <Item name="Alpha"> 
     <CreationDateTime>2012-04-26</CreationDateTime> 
     <Material readOnly="X">Congress</Material> 
    </Item> 
    <Item name="Beta"> 
     <CreationDateTime>2012-05-26</CreationDateTime> 
     <Material readOnly="X">Democracy</Material> 
    </Item> 
</Items>

希望這可以讓你在JavaScript中使用XSLT開始更快。

最後一句話，確保您專注於XSLT 1.0，因爲瀏覽器尚不支持2.0。

來源

2012-10-21 14:15:15 Bogdan

簡單的XSLT使用jQuery/JavaScript的

回答

相關問題