Question

目前我有这个：

请注意，显示的两个框是硬编码的，从我的HTML部分的第18行到第70行开始。现在我有一个.XML文件：

<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
<collection>
 <beanRepresentation>
 <beanRepId>222</beanRepId>
 <beanRepName>Bean 1</beanRepName>
 <topY>0</topY>
 <leftX>0</leftX>
 <height>0</height>
 <width>0</width>
 </beanRepresentation>

 <beanRepresentation>
 <beanRepId>223</beanRepId>
 <beanRepName>Bean 2</beanRepName>
 <topY>0</topY>
 <leftX>0</leftX>
 <height>0</height>
 <width>0</width>
</beanRepresentation>

</collection>

我希望能够解析此信息，然后根据此.XML文件显示框，我应该使用什么？ jQuery的？或者只是简单的Javascript？有人可以帮助我发布我在这里发布的示例。

topY分别是top，而leftX分别是left jsPlumb.draggable(id)。 beanRepName应该是显示在框中的名称，beanRepId是我的Jacascript文件中{{1}}中的整数。所以我需要的四个字段是topY，leftX，beanRepId和beanRepName。

Answer 1

由于您已经使用jsPlumb，因此您可以使用jQuery.parseXML()在可搜索的结构中解析xml数据，通过$.each进行迭代并创建并插入新元素html页面，例如通过

$('<div>')
.css({
    top:$currentxmlnode.find('topY').value()+'px'},
    ...
})
.appendTo(...);

检查manual以了解如何从xml树和this检索值以了解如何创建新节点

从XML解析数据并将其显示在HTML上

1 个答案: