JavaScript: create an AJAX wrapper

by gabrieleromanato

HTML

<p><button id="get">GET HTML</button></p>

<div id="output"></div>

CSS

#output {
    padding: 0.5em;
    border: 1px dashed;
    background: #eee;
}

JavaScript

var Ajax = {
	Utils: {
		toQueryString: function(obj) {
			var arr = [],
				str = '';
			for (var prop in obj) {
				var query = prop + '=' + obj[prop];
				arr.push(query);
			}
			str = arr.join('&');
			return str;
		},
		serialize: function(element) {
			if (element.nodeName.toLowerCase() !== 'form') {
				console.warn('serialize() needs a form');
				return;
			}
			var elems = element.elements;
			var serialized = [],
				i, len = elems.length,
				str = '';
			for (i = 0; i < len; i += 1) {
				var element = elems[i];
				var type = element.type;
				var name = element.name;
				var value = element.value;
				switch (type) {
					case 'text':
					case 'textarea':
					case 'select-one':
					case 'hidden':
						str = name + '=' + value;
						serialized.push(str);
						break;
					case 'radio':
					case 'checkbox':
						if (element.checked) {
							str = name + '=' + value;
							serialized.push(str);
						}
						break;
					default:
						break;
				}
			}
			return serialized.join('&');
		},
		getQueryString: function(element) {
			if (element.nodeName.toLowerCase() !== 'a') {
				console.warn('getQueryString() needs an a element');
				return;
			}
			var str = element.href;
			var query = str.split('?');
			return query[1];
		}
	},
	xhr: function() {
		var instance = new XMLHttpRequest();
		return instance;
	},
	getResponseType: function(resp) {
		var type = '';
		if (resp.indexOf('text/xml') != -1 || resp.indexOf('application/xml') != -1) {
			type = 'xml';
		}
		if (resp.indexOf('application/json') != -1) {
			type = 'json';
		}
		if (resp.indexOf('text/html') != -1 || resp.indexOf('text/plain') != -1) {
			type = 'text';
		}
		return type;
	},
	post: function(options) {
		var xhttp = this.xhr(),
			responseType,
			data;
		options.complete = options.complete || function() {};
		options.type = 'POST';
		options.url = options.url || location.href;
		options.data = options.data || null;
		if (typeof options.data === 'object') {
			data =...