Javascript 在由另一个框架中从XML创建的树控制的框架中显示动态内容_Javascript_Html_Xml_Xslt

Javascript 在由另一个框架中从XML创建的树控制的框架中显示动态内容

javascript html xml xslt

Javascript 在由另一个框架中从XML创建的树控制的框架中显示动态内容,javascript,html,xml,xslt,Javascript,Html,Xml,Xslt,我有一个XML文件： <root> <foo>  </foo> </root> 现在我想从中生成一个HTML文件。HTML有两个垂直框架。左侧显示XML文件的树视图。我想让右边的一个显示树状视图的内容：当我点击“foo”节点时，内容将显示在右边现在，我已经编写了一个XSL文件来获取树视图 <?xml version="1.0" encoding="UTF-8"?>

我有一个XML文件：

<root>
  <foo>
    <!--Content Here-->
  </foo>
</root>

现在我想从中生成一个HTML文件。HTML有两个垂直框架。左侧显示XML文件的树视图。我想让右边的一个显示树状视图的内容：当我点击“foo”节点时，内容将显示在右边

现在，我已经编写了一个XSL文件来获取树视图

<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"         xmlns:fo="http://www.w3.org/1999/XSL/Format">

<xsl:output method="html"/>

<xsl:template match="/">
<html>
<head>
  <!-- Some JS code to deal with the "expand", "collapse"... sth like these-->
</head>
<body>
  <table border="0" cellpadding="0" cellspacing="0">
    <tr>
      <td>
        <a onclick="toggle(this)"><img src="plus.gif"/><img src="folder.gif"/>root</a>
        <div style="display:none;">
          <table border="0" cellpadding="0" cellspacing="0">
            <tr>
          <td width="15"></td>
              <td>
                <a><img src="page.gif"/>Foo</a>
              </td>
            </tr>
          </table>
        </div>
      </td>
    </tr>
  </table>
</body>
<html>
</xsl:template>
</xsl:stylesheet>


根
福

和一个HTML文件：

<html>
<head>
<script language="javascript">
function populateFrames(){
    var x = new ActiveXObject("Microsoft.XMLDOM");
    var s = new ActiveXObject("Microsoft.XMLDOM");
    x.async = false
    s.async = false
    x.load("source.xml");
    s.load("tree.xsl");
    var html = x.transformNode(s);
    var destination = document.frames("header").document.open("text/html","replace");
    destination.write(html);
}
</script>
</head>

<frameset onload="populateFrames()" cols="25%,*">
  <frame name="header" scrolling="auto" target="main">
  <frame name="main">
</frameset>
</html>


函数populateFrames（）{
var x=新的ActiveXObject（“Microsoft.XMLDOM”）；
var s=新的ActiveXObject（“Microsoft.XMLDOM”）；
x、 异步=错误
s、 异步=错误
x、 加载（“source.xml”）；
s、 加载（“tree.xsl”）；
var html=x.transformNode；
var destination=document.frames（“header”）.document.open（“text/html”、“replace”）；
destination.write（html）；
}

如您所见，树将显示在

标题

框架中，我希望内容显示在

主

框架中

有人能告诉我怎么做吗？

在“tree.xsl”中，我会将内容HTML呈现为每个树节点的隐藏元素。然后，当单击树节点时，使用最后2行javascript打开第二个内容框并写出相应的内容HTML。

请您详细解释一下？谢谢你