javascript - 如何将 jQuery/Javascript 与玉模板引擎一起使用

Question

这是我到目前为止的翡翠模板的代码

div
  -for(var group_key in data) {
    div.testsuite
      ul
        li(id="testsuite_#{group_key}") #{data[group_key][0].testsuite} (#{data[group_key][0].start_date})
          ul(id="testcases_#{group_key}")
            -for(var i = 0; i < data[group_key].length; i ++) {
              li(id="testcase_#{data[group_key][i].id}") #{data[group_key][i].name}
                ul(id="status_#{data[group_key][i].id}")
                  li Status: #{data[group_key][i].status}

                  #start here
                  -if(data[group_key][i].status == 'Pass') {
                    -document.getElementById(group_key).setAttribute("class", "pass")
                  -} else if (data[group_key][i].status == 'Incomplete') {
                    -document.getElementById(group_key).setAttribute("class", "incomplete")
                  -} else if (data[group_key][i].status == 'Fail') {
                    -document.getElementById(group_key).setAttribute("class", "fail")
                  -} else {

                  -}
                  #end here

                  li Time: #{data[group_key][i].time}
                  li Message: #{data[group_key][i].message}
                  li Time started: #{data[group_key][i].date}
            -}
  -}

我试图从#start here 和 #end here 做的是，如果测试用例状态等于“通过”，则将具有 testsuite_#{group_key} id 的 li 的类设置为通过，否则如果它等于“不完整”，将课程设置为不完整等。

对于 CSS，通过类的背景为绿色，不完整 = 黄色，失败 = 红色。

我将如何做到这一点？见下文

我目前使用 -document.getElementById 时遇到错误.....

我也尝试使用 jQuery，但仍然出现错误。：-$.(group_key).addClass()

Answer 1

问题是前面的破折号document.getElementById。您只需要实际 if/then/else 子句旁边的破折号，而不是执行代码。它试图找到-document并且在这方面失败了。