Safari不会从XSL处理HTML [英] Safari not processing HTML from XSL the same

问题描述

我有一个在Safari浏览器中打开的main.xml。它被处理得很好，由顶部的XSL文件。

我在结果页面上有一些JavaScript，应该使用第二个XML文件，并使用给定的在href调用中的XSL。

第二个文件category.xml上的XSL似乎可以正常工作（正如警报一样），但是当它被插入为孩子到contentbody div，它没有像预期的那样呈现。

为了显示它应该是什么样的，我复制了第二个XSL进程的输出，从警报对话框，进入原来渲染的contentbody div。看起来不错，就像一个ul元素应该产生的。当用XSL输出替换它，这是非常错误的。

我真的很感激一些帮助。为什么Safari（Mac OS Lion和iPad移动Safari）不能通过Javascript中正确执行的XSL呈现插入的HTML输出？如何解决这个问题？

谢谢，

Matt。

main.xml

 <？xml version =1.0encoding =utf-8？ > 
<？xml-stylesheet type =text / xslhref =main.xslt？> 
< Feed xmlns：xsi =http://www.w3.org/2001/XMLSchema-instancexmlns：xsd =http://www.w3.org/2001/XMLSchemaxmlns = http://tempuri.org/\"> 
< Status> OK< / Status> 
<结果> 
< FeedDTO> 
< Id> 2286< / Id> 
< Name>免费查看< / Name> 
< IconName /> 
< / FeedDTO> 
< FeedDTO> 
< Id> 2320< / Id> 
< Name>最新消息< / Name> 
< IconName /> 
< / FeedDTO> 
< FeedDTO> 
< Id> 2249< / Id> 
< Name>有些评论< / Name> 
< IconName /> 
< / FeedDTO> 
< FeedDTO> 
< Id> 2250< / Id> 
< Name>包装< / Name> 
< IconName /> 
< / FeedDTO> 
< / Result> 
< / Feed> 
  

main.xsl

 <？xml version =1.0encoding =iso-8859-1？> 
 
< xsl：stylesheet 
 version =1.0
 xmlns：xsl =http://www.w3.org/1999/XSL/Transform
 xmlns：xsi =http://www.w3.org/2001/XMLSchema-instance
 xmlns：xsd =http://www.w3.org/2001/XMLSchema
 xmlns msws =http://tempuri.org/
> 
 
< xsl：template match =/> 
< html xmlns =http://www.w3.org/1999/xhtml> 
< head> 
< title> main< / title> 
< link href =StyleSheet1.css =stylesheettype =text / css/> 
< script type =text / javascriptsrc =http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js>< / script> 
< script type =text / javascript> 
函数transform（xmlfile，xslfile）
 {
 var xmlRequest = new XMLHttpRequest（）; 
 xmlRequest.open（GET，xmlfile，false）; 
 xmlRequest.send（null）; 
 xml = xmlRequest.responseXML; 
 
 var xslRequest = new XMLHttpRequest（）; 
 xslRequest.open（GET，xslfile，false）; 
 xslRequest.send（null）; 
 xsl = xslRequest.responseXML; 
 
 xsltProcessor = new XSLTProcessor（）; 
 xsltProcessor.importStylesheet（xsl）; 
 
 resultDocument = xsltProcessor.transformToFragment（xml，document）; 
 document.getElementById（contentbody）。appendChild（resultDocument）; 
} 
 
函数go（xmlfile，xslfile）
 {
 var xmlRequest = new XMLHttpRequest（）; 
 xmlRequest.open（GET，xmlfile，false）; 
 xmlRequest.send（null）; 
 xml = xmlRequest.responseXML; 
 
 var xslRequest = new XMLHttpRequest（）; 
 xslRequest.open（GET，xslfile，false）; 
 xslRequest.send（null）; 
 xsl = xslRequest.responseXML; 
 xsltProcessor = new XSLTProcessor（）; 
 xsltProcessor.importStylesheet（xsl）; 
 resultDocument = xsltProcessor.transformToFragment（xml，document）; 
 document.getElementById（contentbody）。innerHTML =; 
 document.getElementById（contentbody）。appendChild（resultDocument）; 
} 
 
函数loadXMLDoc（dname）
 {
 if（window.XMLHttpRequest）
 {
 xhttp = new XMLHttpRequest（）; 
} 
 else 
 {
 xhttp = new ActiveXObject（Microsoft.XMLHTTP）; 
} 
 xhttp.open（GET，dname，false）; 
 xhttp.send（）; 
 return xhttp.responseXML; 
} 
 
函数displayResult（xmlfile，xslfile）
 {
 xml = loadXMLDoc（xmlfile）; 
 xsl = loadXMLDoc（xslfile）; 
 xsltProcessor = new XSLTProcessor（）; 
 xsltProcessor.importStylesheet（xsl）; 
 resultDocument = xsltProcessor.transformToFragment（xml，document）; 
 document.getElementById（contentbody）。innerHTML =; 
 document.getElementById（contentbody）。appendChild（resultDocument）; 
 alert（document.getElementById（contentbody）。innerHTML）; 
} 
< / script> 
< / head> 
< body> 
< div id =main> 
< div id =menu> 
< div id =categorytitle> 
分类
< / div> 
< ul id =categorybody> 
< xsl：for-each select =* / * / msws：FeedDTO> 
< xsl：if test =msws：Name！='自由查看'> 
< li id =menuitem> 
< xsl：element name =a> 
< xsl：attribute name =href> javascript：void（0）< / xsl：attribute> 
< xsl：attribute name =onclick> 
 displayResult（'category.xml'，'category.xslt'）; 
< / xsl：attribute> 
< xsl：value-of select =substring（msws：Name，1，100）/> 
< / xsl：element> 
< / li> 
< / xsl：if> 
< / xsl：for-each> 
< / ul> 
< / div> 
< div id =content> 
< div id =contenttitle> 
内容
< / div> 
< div id =contentbody><！ - 内容从提醒中复制到显示它应该如何看待 - > 
< div xmlns：xsi =http://www.w3.org/2001/XMLSchema-instancexmlns：xsd =http://www.w3.org/2001/XMLSchemaxmlns：msws =http://tempuri.org/>< ul id =categorybody>< li id =categoryitem>< a href =javascript：void（0）onclick =
 XsltTransform（'article.xml'，'article.xslt'）; 
>第一个标题< / a>< / li>< li> 07 Oct 2011< / li>< li>一个很好的长描述1.< / li>< li id =categoryitem>< a href =javascript：void（0）onclick =
 XsltTransform（'article.xml' ，'article.xslt'）; 
>第二个标题< / a>< / li>< li> 2011年10月06日< / li>< li& / li>< li id =categoryitem>< a href =javascript：void（0）onclick =
 XsltTransform（'article.xml'，'article.xslt'）; 
>第三个标题< / a>< / li>< li> 2011年10月06日< / li>< li&一个很好的长描述3.< / li>< li id =categoryitem>< a href =javascript：void（0）onclick =
 XsltTransform（'article.xml' 'article.xslt'）; 
>第四个标题< / a>< / li>< li> 2011年10月5日< / li>< li>一个很好的长描述4.< / li>< li id = categoryitem>< a href =javascript：void（0）onclick =
 XsltTransform（'article.xml'，'article.xslt'）; 
>第五个标题< / a>< / li>< li> 04 Oct 2011< / li>< li>一个很好的长描述5.< / li>< / ul> < / div> 
< / div> 
< / div> 
< / div> 
< / body> 
< / html> 
< / xsl：template> 
 
< / xsl：stylesheet> 
  

content.xml

 <？xml version =1.0encoding =utf-8？> ; 
<？xml-stylesheet type =text / xslhref =category.xslt？> 
< Data xmlns：xsi =http://www.w3.org/ 2001 / XMLSchema-instancexmlns：xsd =http://www.w3.org/2001/XMLSchemaxmlns =http://tempuri.org/> 
< Status> OK< /状态> 
< Result> 
< ResultItems> 
< ArticleLiteDTO> 
< Id> 2913935< / Id> 
< Title& ; / Title> 
<描述>一个很好的长描述1.< / Description&$ < PublishedDate> 2011-10-07T00：00：00< / PublishedDate> 
< SmallImageUrl /> 
< LargeImageUrl /> 
< / ArticleLiteDTO> 
< ArticleLiteDTO> 
< Id> 2913226< / Id> 
< Title>第二标题< / Title> 
<描述>一个很好的长描述2.< / Description> 
< PublishedDate> 2011-10-06T00：00：00< / PublishedDate> 
< SmallImageUrl /> 
< LargeImageUrl /> 
< / ArticleLiteDTO> 
< ArticleLiteDTO> 
< Id> 2913137< / Id> 
< Title>第3个标题< / Title> 
<描述>一个很好的长描述3.< / Description> 
< PublishedDate> 2011-10-06T00：00：00< / PublishedDate> 
< SmallImageUrl /> 
< LargeImageUrl /> 
< / ArticleLiteDTO> 
< ArticleLiteDTO> 
< Id> 2912539< / Id> 
< Title>第4标题< / Title> 
<描述>一个很好的长描述4.< / Description> 
< PublishedDate> 2011-10-05T00：00：00< /DownDate> 
< SmallImageUrl /> 
< LargeImageUrl /> 
< / ArticleLiteDTO> 
< ArticleLiteDTO> 
< Id> 2911761< / Id> 
< Title>第五标题< / Title> 
<描述>一个很好的长描述5.< / Description> 
< PublishedDate> 2011-10-04T00：00：00< / PublishedDate> 
< SmallImageUrl /> 
< LargeImageUrl /> 
< / ArticleLiteDTO> 
< / ResultItems> 
< / Result> 
< / Data> 
  

content.xsl

 <？xml version =1.0encoding =iso-8859-1？> 
 
< xsl：stylesheet 
 version =1.0
 xmlns：xsl =http://www.w3.org/1999/XSL/Transform
 xmlns：xsi =http://www.w3.org/2001/XMLSchema-instance
 xmlns：xsd =http://www.w3.org/2001/XMLSchema
 xmlns msws =http://tempuri.org/
> 
 
< xsl：template match =/> 
< div> 
< ul id =categorybody> 
< xsl：for-each select =* / * / * / msws：ArticleLiteDTO> 
< li id =categoryitem> 
 
< xsl：element name =a> 
< xsl：attribute name =href> javascript：void（0）< / xsl：attribute> 
< xsl：attribute name =onclick> 
 XsltTransform（'article.xml'，'article.xslt'）; 
< / xsl：attribute> 
< xsl：value-of select =msws：Title/> 
< / xsl：element> 
< / li> 
< li> 
< xsl：call-template name =FormatDate> 
< xsl：with-param name =DateTimeParamselect =msws：PublishedDate/> 
< / xsl：call-template> 
< / li> 
< li> 
< xsl：value-of select =msws：Description/> 
< / li> 
 
< / xsl：for-each> 
< / ul> 
< / div> 
< / xsl：template> 
 
< xsl：template name =FormatDate> 
<！ -  expecting datetime example：2009-04-20T00：00：00  - > 
< xsl：param name =DateTimeParam/> 
 
<！ - 重新格式化日期参数以便于使用 - > 
< xsl：variable name =DateTime> 
< xsl：value-of select =substring（$ DateTimeParam，1,10）/> 
< / xsl：variable> 
 
<！ - 新日期格式2007年1月20日 - > 
< xsl：variable name =year> 
< xsl：value-of select =substring-before（$ DateTime，' - '）/> 
< / xsl：variable> 
< xsl：variable name =mo-temp> 
< xsl：value-of select =substring-after（$ DateTime，' - '）/> 
< / xsl：variable> 
< xsl：variable name =mo> 
< xsl：value-of select =substring-before（$ mo-temp，' - '）/> 
< / xsl：variable> 
< xsl：variable name =day> 
< xsl：value-of select =substring-after（$ mo-temp，' - '）/> 
< / xsl：variable> 
 
< xsl：if test =（string-length（$ day）& lt; 2）> 
< xsl：value-of select =0/> 
< / xsl：if> 
< xsl：value-of select =$ day/> 
< xsl：value-of select =''/> 
< xsl：choose> 
< xsl：when test =$ mo ='1'或$ mo ='01'> Jan< / xsl：when> 
< xsl：when test =$ mo ='2'or $ mo ='02'> Feb< / xsl：when> 
< xsl：when test =$ mo ='3'或$ mo ='03'> Mar< / xsl：when> 
< xsl：when test =$ mo ='4'or $ mo ='04'> Apr< / xsl：when> 
< xsl：when test =$ mo ='5'or $ mo ='05'> May< / xsl：when> 
< xsl：when test =$ mo ='6'or $ mo ='06'> Jun< / xsl：when> 
< xsl：when test =$ mo ='7'or $ mo ='07'> Jul< / xsl：when> 
< xsl：when test =$ mo ='8'or $ mo ='08'> Aug< / xsl：when> 
< xsl：when test =$ mo ='9'或$ mo ='09'> Sep< / xsl：when> 
< xsl：when test =$ mo ='10'> Oct< / xsl：when> 
< xsl：when test =$ mo ='11'> Nov< / xsl：when> 
< xsl：when test =$ mo ='12'> Dec< / xsl：when> 
< / xsl：choose> 
< xsl：value-of select =''/> 
< xsl：value-of select =$ year/> 
< / xsl：template> 
 
< / xsl：stylesheet> 
  

解决方案

确定 - 你有一个命名空间的问题。这是将content.xsl（格式化为可读性缩写）的content.xml转换为DOM文档片段的输出。

  <？xml version =1.0encoding =UTF-8？> 
< div 
 xmlns：msws =http://tempuri.org/
 xmlns：xsd =http://www.w3.org/2001/XMLSchema
 xmlns：xsi =http://www.w3.org/2001/XMLSchema-instance> 
< ul id =categorybody> 
< li id =categoryitem> 
< a href =javascript：void（0）onclick =
 XsltTransform（&'article.xml&'&'article.xslt&））; 
>第一个标题< / a> 
< / li> 
< li> 2011年10月07日< / li> 
< li>一个很好的长描述1.< / li> 
< li id =categoryitem> 
 ... etc ... 
< / ul> 
< / div> 
  

需要注意的是这是一个基于XML的DOM片段，而元素在 no namespace 。所以当你将这个直接添加到你的DOM中（就像你的问题一样），Safari将不会把这些元素视为HTML元素，因为它们希望它们位于 http：//www.w3 .org / 1999 / xhtml 命名空间。

当片段被序列化时，它将被转换为上面的XML。

当使用innerHTML解析该XML时（如修改后的工作代码中所述），解析器将将XML视为HTML。根据HTML5解析实践，元素将自动放入 http://www.w3.org/1999/xhtml 命名空间中，并将被视为HTML，所以事情按预期工作。

解决方案有几个问题。第一个是将XML序列化为HTML并解析为HTML是有风险的。例如，脚本元素可以被序列化为< script src =.../> ，这可以作为XML，但不能是HTML。

其次，它需要一个序列化/解析循环，这会影响性能。

解决这个问题可能就像添加 xmlns =http://www.w3.org/1999/xhtml作为 xsl：stylsheet 元素的属性的 content.xsl ，但我还没有在Safari中测试过。

I have a main.xml which I open in the Safari browser. It is processed just fine by the XSL file indicated at the top.

I have some javascript on the resulting page which should take a second XML file and process it using the given XSL in the href call.

The XSL on the second file, category.xml, seems to work fine (as evidenced by the alert) but when it is inserted as a child to the contentbody div, it does not render as expected.

To show what it should look like, I copied the output of the second XSL process, from the alert dialog, into the originally rendered contentbody div. It looks fine, just like a ul element should produce. When replacing it with the XSL output, it is very wrong.

I would really appreciate some help with this. Why is Safari (Mac OS Lion and iPad mobile Safari) not rendering the inserted HTML output by the XSL executed in Javascript properly? How should I fix this?

Thank you,

Matt.

main.xml

<?xml version="1.0" encoding="utf-8"?>
<?xml-stylesheet type="text/xsl" href="main.xslt"?>
<Feed xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:xsd="http://www.w3.org/2001/XMLSchema" xmlns="http://tempuri.org/">
  <Status>OK</Status>
  <Result>
    <FeedDTO>
      <Id>2286</Id>
      <Name>Free to view</Name>
      <IconName />
    </FeedDTO>
    <FeedDTO>
      <Id>2320</Id>
      <Name>Latest news</Name>
      <IconName />
    </FeedDTO>
    <FeedDTO>
      <Id>2249</Id>
      <Name>Some reviews</Name>
      <IconName />
    </FeedDTO>
    <FeedDTO>
      <Id>2250</Id>
      <Name>The wrap</Name>
      <IconName />
    </FeedDTO>
  </Result>
</Feed>

main.xsl

<?xml version="1.0" encoding="iso-8859-1"?>

<xsl:stylesheet
    version="1.0"
    xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
    xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
    xmlns:xsd="http://www.w3.org/2001/XMLSchema"
    xmlns:msws="http://tempuri.org/"
    >

  <xsl:template match="/">
    <html xmlns="http://www.w3.org/1999/xhtml">
      <head>
        <title>main</title>
        <link href="StyleSheet1.css" rel="stylesheet" type="text/css" />
        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
        <script type="text/javascript">
            function transform(xmlfile,xslfile)
            {
                var xmlRequest = new XMLHttpRequest();
                xmlRequest.open("GET", xmlfile, false);
                xmlRequest.send(null);
                xml= xmlRequest.responseXML;

                var xslRequest = new XMLHttpRequest();
                xslRequest.open("GET", xslfile, false);
                xslRequest.send(null);
                xsl = xslRequest.responseXML;

                xsltProcessor = new XSLTProcessor();
                xsltProcessor.importStylesheet(xsl);

                resultDocument = xsltProcessor.transformToFragment(xml,document);
                document.getElementById("contentbody").appendChild(resultDocument);
            }

            function go(xmlfile,xslfile)
            {
                var xmlRequest = new XMLHttpRequest();
                xmlRequest.open("GET", xmlfile, false);
                xmlRequest.send(null);
                xml= xmlRequest.responseXML;

                var xslRequest = new XMLHttpRequest();
                xslRequest.open("GET", xslfile, false);
                xslRequest.send(null);
                xsl = xslRequest.responseXML;
                xsltProcessor=new XSLTProcessor();
                xsltProcessor.importStylesheet(xsl);
                resultDocument = xsltProcessor.transformToFragment(xml,document);
                document.getElementById("contentbody").innerHTML = "";
                document.getElementById("contentbody").appendChild(resultDocument);
            }

            function loadXMLDoc(dname)
            {
                if (window.XMLHttpRequest)
                {
                    xhttp=new XMLHttpRequest();
                }
                else
                {
                    xhttp=new ActiveXObject("Microsoft.XMLHTTP");
                }
                xhttp.open("GET",dname,false);
                xhttp.send("");
                return xhttp.responseXML;
            }

            function displayResult(xmlfile,xslfile)
            {
                xml=loadXMLDoc(xmlfile);
                xsl=loadXMLDoc(xslfile);
                xsltProcessor=new XSLTProcessor();
                xsltProcessor.importStylesheet(xsl);
                resultDocument = xsltProcessor.transformToFragment(xml,document);
                document.getElementById("contentbody").innerHTML = "";
                document.getElementById("contentbody").appendChild(resultDocument);
                alert(document.getElementById("contentbody").innerHTML);
            }
        </script>
      </head>
      <body>
        <div id="main">
          <div id="menu">
            <div id="categorytitle">
              Categories
            </div>
            <ul id="categorybody">
              <xsl:for-each select="*/*/msws:FeedDTO">
                <xsl:if test="msws:Name != 'Free to view'">
                  <li id="menuitem">
                    <xsl:element name="a">
                      <xsl:attribute name="href">javascript:void(0)</xsl:attribute>
                      <xsl:attribute name="onclick">
                        displayResult('category.xml','category.xslt');
                      </xsl:attribute>
                      <xsl:value-of select="substring(msws:Name, 1, 100)"/>
                    </xsl:element>
                  </li>
                </xsl:if>
              </xsl:for-each>
            </ul>
          </div>
          <div id="content">
            <div id="contenttitle">
              Content
            </div>
            <div id="contentbody"><!-- CONTENT HERE COPIED FROM ALERT TO SHOW WHAT IT SHOULD LOOK LIKE -->
              <div xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:xsd="http://www.w3.org/2001/XMLSchema" xmlns:msws="http://tempuri.org/"><ul id="categorybody"><li id="categoryitem"><a href="javascript:void(0)" onclick="
                XsltTransform('article.xml','article.xslt');
              ">The first title</a></li><li>07 Oct 2011</li><li>A nice long description 1.</li><li id="categoryitem"><a href="javascript:void(0)" onclick="
                XsltTransform('article.xml','article.xslt');
              ">The second title</a></li><li>06 Oct 2011</li><li>A nice long description 2.</li><li id="categoryitem"><a href="javascript:void(0)" onclick="
                XsltTransform('article.xml','article.xslt');
              ">The third title</a></li><li>06 Oct 2011</li><li>A nice long description 3.</li><li id="categoryitem"><a href="javascript:void(0)" onclick="
                XsltTransform('article.xml','article.xslt');
              ">The fourth title</a></li><li>05 Oct 2011</li><li>A nice long description 4.</li><li id="categoryitem"><a href="javascript:void(0)" onclick="
                XsltTransform('article.xml','article.xslt');
              ">The fifth title</a></li><li>04 Oct 2011</li><li>A nice long description 5.</li></ul></div>
            </div>
          </div>
        </div>
      </body>
    </html>
  </xsl:template>

</xsl:stylesheet>

content.xml

<?xml version="1.0" encoding="utf-8"?>
<?xml-stylesheet type="text/xsl" href="category.xslt"?>
<Data xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:xsd="http://www.w3.org/2001/XMLSchema" xmlns="http://tempuri.org/">
  <Status>OK</Status>
  <Result>
    <ResultItems>
      <ArticleLiteDTO>
        <Id>2913935</Id>
        <Title>The first title</Title>
        <Description>A nice long description 1.</Description>
        <PublishedDate>2011-10-07T00:00:00</PublishedDate>
        <SmallImageUrl />
        <LargeImageUrl />
      </ArticleLiteDTO>
      <ArticleLiteDTO>
        <Id>2913226</Id>
        <Title>The second title</Title>
        <Description>A nice long description 2.</Description>
        <PublishedDate>2011-10-06T00:00:00</PublishedDate>
        <SmallImageUrl />
        <LargeImageUrl />
      </ArticleLiteDTO>
      <ArticleLiteDTO>
        <Id>2913137</Id>
        <Title>The third title</Title>
        <Description>A nice long description 3.</Description>
        <PublishedDate>2011-10-06T00:00:00</PublishedDate>
        <SmallImageUrl />
        <LargeImageUrl />
      </ArticleLiteDTO>
      <ArticleLiteDTO>
        <Id>2912539</Id>
        <Title>The fourth title</Title>
        <Description>A nice long description 4.</Description>
        <PublishedDate>2011-10-05T00:00:00</PublishedDate>
        <SmallImageUrl />
        <LargeImageUrl />
      </ArticleLiteDTO>
      <ArticleLiteDTO>
        <Id>2911761</Id>
        <Title>The fifth title</Title>
        <Description>A nice long description 5.</Description>
        <PublishedDate>2011-10-04T00:00:00</PublishedDate>
        <SmallImageUrl />
        <LargeImageUrl />
      </ArticleLiteDTO>
    </ResultItems>
  </Result>
</Data>

content.xsl

<?xml version="1.0" encoding="iso-8859-1"?>

<xsl:stylesheet
    version="1.0"
    xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
    xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
    xmlns:xsd="http://www.w3.org/2001/XMLSchema"
    xmlns:msws="http://tempuri.org/"
    >

  <xsl:template match="/">
<div>
    <ul id="categorybody">
      <xsl:for-each select="*/*/*/msws:ArticleLiteDTO">
        <li id="categoryitem">

            <xsl:element name="a">
              <xsl:attribute name="href">javascript:void(0)</xsl:attribute>
              <xsl:attribute name="onclick">
                XsltTransform('article.xml','article.xslt');
              </xsl:attribute>
              <xsl:value-of select="msws:Title"/>
            </xsl:element>
          </li>
          <li>
            <xsl:call-template name="FormatDate">
              <xsl:with-param name="DateTimeParam" select="msws:PublishedDate" />
            </xsl:call-template>
          </li>
          <li>
            <xsl:value-of select="msws:Description"/>
          </li>

      </xsl:for-each>
    </ul>
</div>
  </xsl:template>

  <xsl:template name="FormatDate">
    <!-- expecting datetime example: 2009-04-20T00:00:00 -->
    <xsl:param name="DateTimeParam" />

    <!-- reformat date param to be easier to use -->
    <xsl:variable name="DateTime">
      <xsl:value-of select="substring($DateTimeParam,1,10)"/>
    </xsl:variable>

    <!-- new date format January 20, 2007 -->
    <xsl:variable name="year">
      <xsl:value-of select="substring-before($DateTime,'-')" />
    </xsl:variable>
    <xsl:variable name="mo-temp">
      <xsl:value-of select="substring-after($DateTime,'-')" />
    </xsl:variable>
    <xsl:variable name="mo">
      <xsl:value-of select="substring-before($mo-temp,'-')" />
    </xsl:variable>
    <xsl:variable name="day">
      <xsl:value-of select="substring-after($mo-temp,'-')" />
    </xsl:variable>

    <xsl:if test="(string-length($day) &lt; 2)">
      <xsl:value-of select="0"/>
    </xsl:if>
    <xsl:value-of select="$day"/>
    <xsl:value-of select="' '"/>
    <xsl:choose>
      <xsl:when test="$mo = '1' or $mo = '01'">Jan</xsl:when>
      <xsl:when test="$mo = '2' or $mo = '02'">Feb</xsl:when>
      <xsl:when test="$mo = '3' or $mo = '03'">Mar</xsl:when>
      <xsl:when test="$mo = '4' or $mo = '04'">Apr</xsl:when>
      <xsl:when test="$mo = '5' or $mo = '05'">May</xsl:when>
      <xsl:when test="$mo = '6' or $mo = '06'">Jun</xsl:when>
      <xsl:when test="$mo = '7' or $mo = '07'">Jul</xsl:when>
      <xsl:when test="$mo = '8' or $mo = '08'">Aug</xsl:when>
      <xsl:when test="$mo = '9' or $mo = '09'">Sep</xsl:when>
      <xsl:when test="$mo = '10'">Oct</xsl:when>
      <xsl:when test="$mo = '11'">Nov</xsl:when>
      <xsl:when test="$mo = '12'">Dec</xsl:when>
    </xsl:choose>
    <xsl:value-of select="' '"/>
    <xsl:value-of select="$year"/>
  </xsl:template>

</xsl:stylesheet>

解决方案

OK - what you have is a namespacing problem. This is the output of transforming content.xml with content.xsl (formatted and abbreviated for readability) as a DOM document fragment.

<?xml version="1.0" encoding="UTF-8"?>
<div 
    xmlns:msws="http://tempuri.org/" 
    xmlns:xsd="http://www.w3.org/2001/XMLSchema" 
    xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance">
    <ul id="categorybody">
        <li id="categoryitem">
            <a href="javascript:void(0)" onclick="
               XsltTransform(&apos;article.xml&apos;,&apos;article.xslt&apos;);
            ">The first title</a>
        </li>
        <li>07 Oct 2011</li>
        <li>A nice long description 1.</li>
        <li id="categoryitem">
        ... etc ... 
    </ul>
</div>

The thing to note about this is that this is an XML based DOM fragment - and the elements are in no namespace. So when you add this direct to your DOM (as is done in your question), Safari will not consider the elements to be HTML elements - because it expects those to be in the http://www.w3.org/1999/xhtml namespace.

When fragment is serialized, it will be converted into the XML above.

When that XML is parsed back using innerHTML, (as is done in your revised working code), the parser will treat the XML as HTML. In accordance with HTML5 parsing practice, the elements will automatically be put in to the http://www.w3.org/1999/xhtml namespace and will be treated as HTML, so things work as intended.

There's a couple of problems with your solution. The first is that serializing as XML and parsing back as HTML is risky. For example, script elements may get serialized as <script src="..." /> which is OK as XML, but not as HTML.

Second, it requires a serialize/parse cycle that will hurt performance.

Resolving this may be as simple as adding xmlns="http://www.w3.org/1999/xhtml" as an attribute to the xsl:stylsheet element of content.xsl, but I haven't tested this in Safari.

这篇关于Safari不会从XSL处理HTML的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！