使用purejs创建动态ID

时间:2014-02-26 13:28:54

标签: javascript pure-js

使用purejs,我想为每个渲染元素创建动态id。

在这段代码中,我需要为每个标签设置id。这个'a'标签将创建取决于jsonData。

<!-- HTML template -->
  <div id="template" class="template">
    Hello <a></a>
  </div>
  <!-- result place -->
  <div id="display" class="result"></div>

<script>
    var jsonData = {data:[{who:'Google!',site:'http://www.google.com/'},{who:'Yahoo!',site:'http://www.yahoo.com/'}]};

    //select the template
    $('#template')

      //map the HTML with the JSON data
      .directives({
        'div a':{
            'd<-data':{
              '.':'d.who',
              '@href':'d.site'
            }
        }
      })

      //generate the new HTML
      .render(jsonData)

      //place the result in the DOM, using any jQuery command
      .appendTo('#display');

  </script>

1 个答案:

答案 0 :(得分:1)

要设置动态ID,请使用“.pos”标记。这个“.pos”将数据的位置放在一个数组中。

//select the template
$('#template')

//map the HTML with the JSON data
.directives({
    'div a':{
        'd<-data':{
            '@id':'xyz_#{d.pos}',
            '.':'d.who',
            '@href':'d.site'
        }
    }
})

//generate the new HTML
.render(jsonData)

//place the result in the DOM, using any jQuery command
.appendTo('#display');