基于underscore和jQuery的微型告警系统
一个监控系统 我们今天要使用underscore.js和jQuery来构建一个客户端的应用，这个应用是一个监控系统的前端，设计师已经给出了界面设计： 而对应的服务器端的API也已经就绪了： $ curl http://localhost:9527/alarms.json -s | jq . 会看到诸如这样的返回值： [ { "proiority": "critical", "occurrence": "2/12/2015 01:23 AM", "summary": "heartbeat failure", "node": "VIQ002" }, { "proiority": "major", "occurrence": "2/12/2015 01:22 AM", "summary": "packages are rejected", "node": "VIQ002" }, { "proiority": "medium", "occurrence": "2/11/2015 01:23 AM", "summary": "connection cannot be established", "node": "VIQ002" } ] 每条告警信息都包含：优先级，发生时间，描述信息，以及发生告警的节点名称。 我们要将这些信息整合，并展示在页面上。 mockup 我在《3周3页面》中讨论过现代前端开发的方式，你也可以参考这篇文章以及这篇文章。我们这里还是采用相同的方式来实现这个mockup，也就是静态页面。 首先我们在index.html中编写HTML： <div class="container"> <h1>Active Event List in transmission</h1> <ul class="events"> <li> <div class="event critical"> <h3>heartbeat failure @ VIQ002</h3> <span class="date">2/12/2015 01:23 AM</span> </div> </li> <li> <div class="event major"> <h3>packages are rejected</h3> <span class="date">2/12/2015 01:23 AM</span> </div> </li> <li> <div class="event medium"> <h3>connection cannot be established</h3> <span class="date">2/12/2015 01:23 AM</span> </div> </li> <!...