// app.js
var app = http.createServer(function(req, res){
  if(req.url.indexOf("/scripts/") >= 0){
    render(req.url.slice(1), "application/javascript", httpHandler);
  } else if(req.headers['x-requested-with'] === 'XMLHttpRequest'){
    // Send Ajax response
  } else{
    render('views/index.html', 'text/html', httpHandler);
  }
}

// app.js
function render(path, contentType, fn) {
  fs.readFile(__dirname + '/' + path, 'utf-8', function (err, str) {
    fn(err, str, contentType);
  });
}
var httpHandler = function (err, str, contentType) {
  if (err) {
    res.writeHead(500, {'Content-Type': 'text/plain'});
    res.end('An error has occured: ' + err.message);
  } else {
    res.writeHead(200, {'Content-Type': contentType});
    res.end(str);
  }
};

// test/app.request.js
it("responds with html", function(done){
  request(app)
    .get("/")
    .expect("Content-Type", /html/)
    .expect(200, done);
});
it('responds with javascript', function (done) {
request(app)
  .get('/scripts/index.js')
  .expect('Content-Type', /javascript/)
  .expect(200, done);
});
it('responds with json', function (done) {
request(app)
  .get('/')
  .set('X-Requested-With', 'XMLHttpRequest')
  .expect('Content-Type', /json/)
  .expect(200, done);
});

// views/index.html
<h1>Vanilla Ajax without jQuery</h1>
<button id="retrieve" data-url="/">Retrieve</button>
<p id="results"></p>

(function() {
  var retrieve = document.getElementById('retrieve'),
    results = document.getElementById('results'),
    toReadyStateDescription = function(state) {
      switch (state) {
        case 0:
          return 'UNSENT';
        case 1:
          return 'OPENED';
        case 2:
          return 'HEADERS_RECEIVED';
        case 3:
          return 'LOADING';
        case 4:
          return 'DONE';
        default:
          return '';
      }
    };
  retrieve.addEventListener('click', function(e) {
    var oReq = new XMLHttpRequest();
    oReq.onload = function() {
      console.log('Inside the onload event');
    };
    oReq.onreadystatechange = function() {
      console.log('Inside the onreadystatechange ev![此处输入图片的描述][1]ent with readyState: ' +
        toReadyStateDescription(oReq.readyState));
    };
    oReq.open('GET', e.target.dataset.url, true);
    oReq.send();
  });
}());

var oReq = new XMLHttpRequest();
oReq.open('GET', e.target.dataset.url, true);
oReq.setRequestHeader('X-Requested-With', 'XMLHttpRequest');
oReq.send();

if (req.headers['x-requested-with'] === 'XMLHttpRequest') {
  res.writeHead(200, {'Content-Type': 'application/json'});
  res.end(JSON.stringify({message: 'Hello World!'}));
}

oReq.setRequestHeader('x-vanillaAjaxWithoutjQuery-version', '1.0');

if (req.headers['x-requested-with'] === 'XMLHttpRequest' &&
  req.headers['x-vanillaajaxwithoutjquery-version'] === '1.0') {
  // Send Ajax response
}

var oReq = new XMLHttpRequest();
oReq.onload = function (e) {
  results.innerHTML = e.target.response.message;
};
oReq.open('GET', e.target.dataset.url, true);
oReq.responseType = 'json';
oReq.send();

oReq.onload = function (e) {
  var xhr = e.target;
  if (xhr.responseType === 'json') {
    results.innerHTML = xhr.response.message;
  } else {
    results.innerHTML = JSON.parse(xhr.responseText).message;
  }
};

var bustCache = '?' + new Date().getTime();
oReq.open('GET', e.target.dataset.url + bustCache, true);

var oReq = new XMLHttpRequest();
oReq.onload = function (e) {
  results.innerHTML = e.target.response.message;
};
oReq.open('GET', e.target.dataset.url + '?' + new Date().getTime(), true);
oReq.responseType = 'json';
oReq.send();