javascript - XML/JavaScript : assigning sequential numbers to an xml tree based on node hierarchy

Question

我想知道是否有人知道如何做到这一点:我有一个像这样的 XML 树 - 我已经按照它们应该出现的顺序添加了数字，但这需要是动态的:

<scene id="1>
  <scene id="2>
    <scene id="3"/>
  </scene>
  <scene id="4>
<scene id="5>
<scene id="6>

其中有 3 个父场景，三个父场景中的每个场景都有任意数量的子场景和子场景。三个场景中的每一个都将分配自己的 Sprite 图像，用于代表每个场景的图标，其所有子级都将使用其父 Sprite ，但我需要找出一个系统来为 Sprite 分配适当的背景位置关于它在树中的位置。所以我需要做的是说:

每个根 Sprite 都在 0px 水平位置。第一个 child 位于 (1*80px)。第二个 child 在 2*80px。第一个子子项位于最后一个子项所在的位置加上 80px。

所以基本上我需要为这个序列中的每个节点分配逻辑编号。我将如何在数学上做到这一点？我正在使用 javascript (jquery) 来解析 XML。

感谢您提出任何想法。

Answer 1

假设您使用的是 jQuery 1.5+，并且您有一个格式良好、有效的 XML 文档(即带有根元素)，您可以这样做:

var nextId = 1;
var xmlStr = '<movie>' +
             '  <scene>' + // id1
             '    <scene>' + // id2
             '      <scene/>' + // id3
             '    </scene>' +
             '    <scene/>' + // id4
             '  </scene>' +
             '  <scene/>' + // id5
             '</movie>';
var doc = $(xmlStr);
$(doc).find('scene').each(function(i, el) {
  el.id = ("id" + nextId++);
});

请注意，有效的“id”属性不能以数字开头，因此新值“id1”等。生成的 doc 应该有每个“场景”元素和递增的“id”值(value)。

doc;
// <movie>​
//   <scene id=​"id1">​
//     <scene id=​"id2">​
//       <scene id=​"id3">​</scene>​
//     </scene>​
//     <scene id=​"id4">​</scene>​
//   </scene>​
//   <scene id=​"id5">​</scene>​
// </movie>​