实现一个简单的用户管理系统实例--(ajax+node+mysql前后端交互)

      这是一个最近完成的小练习，实现了用户信息GUID功能的小DEMO. 技术上：前端采用HTML+CSS+原生Javascript+ajax，后端框架采用node.js, 数据库为mysql.

    实例背景：  Javascript 是目前web 页面上最流行的脚本语言，它主要实现与用户的动态交互行为,本身就是事件驱动语言。Node.js 是一个基于 Chrome V8 引擎的 Javascript 运行环境。这样，Javascript 不仅能在网页前端执行，也能在后端执行。 Node.js 使用了一个事件驱动、非阻塞式 I/O 的模型。而且，V8引擎执行Javascript的速度非常快，性能非常好。因此，Node.js服务器 而得以轻量和高效，非常适合在分布式设备（跨平台）上运行数据密集型的实时应用。所以，深入掌握理解node.js开发非常重要。

    系统页面展示：本实例主要目的是练习前后端数据的交互，功能很简单，但很完整。主要内容如下：

    1. 页面样式重置：浏览器有默值认的样式，这些默认样式在不同的浏览器上有不同的效果，在各种浏览器上默认样式统一。

    2. 用户登录界面：(1)通过cookie 实现登录权限控制 (2) 非注册用户登录报错。

2. 用户注册界面:

3. 进入后台管理界面： 实现用户信息的GUID。

 部分源代码展示：

1. ajax 的封装：

/**
 *如果是默认参数 就可以不传
 * @param method 请求的方法
 * @param url 请求的地址
 * @param data 发送的数据
 * @param success 数据请求成功以后，需要处理的业务逻辑，就是一个函数块。
 * return undefined
 */
function ajax(options) {
  // 给method默认值  默认为get
  var method = options.method || 'GET';
  //  发送请求
  var xhr = null;
  try {
    xhr = new XMLHttpRequest();
  } catch (e) {
    xhr = new ActiveXObject('Microsoft.XMLHTTP');
  }
  if (method === 'GET') {
    xhr.open('GET', options.url + "?" + options.data, true);
    xhr.send();
  } else if (method === 'POST') {

    xhr.open('POST', options.url, true);
    xhr.setRequestHeader("content-type", "application/x-www-form-urlencoded");
    xhr.send(options.data);
  } else {
    console.log("请求方式不正确")
  }
  xhr.onreadystatechange = function () {
    if (xhr.readyState === 4 && x