Node.js 翡翠中的可变范围

我有一个简单的问题。例如，我在jade文件中有下面的代码

block content
    - var i = 0;  // 'first declaring'

    div#id
        p #{i}   // don't change !?   item = {'one', 'two', ...} for example
    button(onclick="next()") click

    script.
      var i = 0;   // 'second declaring'
      function next() {
      console.log(i);  
      var myid = document.getElementById("id");    
      myid.innerHTML = "#{items[i].a"
      i++;
    };

---

我的问题是：“第一次声明”和“第二次声明”var i=0之间有什么区别。如何更改函数next（）中“first declaration”的全局值。

Jade将把这个模板编译成函数，所以要查看代码，只需手动将这个模板编译成js文件-请参阅示例。IMHO，myid.innerHTML将不会由jade编译，因此它将以原始形式以html的形式出现。也许我错了，看看编译后的代码