所以我有一个类似模板的脚本,我试图用jQuery解析。问题是我有一些我想要用数据替换的标签,这通常很好,但我想循环对象属性,这使得它变得更加困难。
我想尽可能少地依赖外部库,所以我只是在这里使用jQuery。我知道Angular可能会有所帮助,但我还不知道。
模板代码如下所示:
<?xml version="1.0" ?>
<div id="test">
<each obj="list">
<div class="listdiv">
<span><value>thing</value></span>
<span><value>thing2</value></span>
<span><value>thing3</value></span>
<div>
<each obj="moreStuff">
<span>blah: <value>blah</value></span>
<span>foo: <value>foo</value></span>
</each>
</div>
</div>
</each>
</div>
我想传递以下JSON对象:
{
list: [
{ thing: 3, thing2: 4, thing3: 5, moreStuff: [{blah:1, foo:2},{blah:4, foo:6}] },
{ thing: 1, thing2: 1, thing3: 2, moreStuff: [{blah:4, foo:6}] }
]
}
我想要的是它出来:
<div id="test">
<div class="listdiv">
<span>3</span>
<span>4</span>
<span>5</span>
<div>
<span>blah: 1</span>
<span>foo: 2</span>
<span>blah: 4</span>
<span>foo: 6</span>
</div>
</div>
<div class="listdiv">
<span>1</span>
<span>1</span>
<span>2</span>
<div>
<span>blah: 4</span>
<span>foo: 6</span>
</div>
</div>
</div>
我使用正则表达式让它正常工作,但当然使用DOM操作更干净,并且它也更易于扩展。导致问题的是<each>
标签的递归性质以及<value>
标签必须从其父级获取数据的事实。
我已经尝试了很多方法来做到这一点,但每次我有一个递归问题(无限递归,我无法让它来替换东西)或者它无法正确提取数据。有没有办法很好地做到这一点?