用JavaScript实现jQuery的$.getJSON和$load()的方法

用JavaScript实现jQuery的$.getJSON和$load()的方法

jquery就是javascript写的，你去看jQuery的源码不就什么都清楚了

ajax对象而已，下面是一个DEMO，希望你能看的懂

 <div id="dv"></div>
<script>
    var $ = {
        createXHR: function () { var xhr = window.XMLHttpRequest ? new XMLHttpRequest() : window.ActiveXObject ? new ActiveXObject("microsoft.xmlhttp") : false; return xhr; },
        addTimeSpan: function (url) { if (url.indexOf('?') == -1) url += '?_=' + new Date().getTime(); return url; },
        getJSON: function (url, success) {
            var xhr = this.createXHR();
            if (!xhr) { alert('你浏览器不支持AJAX！'); return false; }
            url = this.addTimeSpan(url);
            xhr.open("GET", url, true);
            xhr.onreadystatechange = function () {
                if (xhr.readyState == 4) {
                    if (xhr.status == 0 || xhr.status == 200) {
                        var r = xhr.responseText;
                        try {
                            r = eval('(' + r + ')');
                            if (typeof success == 'function') success.call(xhr, r);
                        }
                        catch (ex) { alert('返回的JSON格式的字符串有问题！'); }
                    }
                    else alert('发生错误\n' + xhr.responseText);
                }
            }
            xhr.send(null);
        },
        load: function (id, url, success) {
            var o = document.getElementById(id);
            if (!o) { alert('对象不存在！'); return false }
            var xhr = this.createXHR();
            if (!xhr) { alert('你浏览器不支持AJAX！'); return false; }
            url = this.addTimeSpan(url);
            xhr.open("GET", url, true);
            xhr.onreadystatechange = function () {
                if (xhr.readyState == 4) {
                    if (xhr.status == 0 || xhr.status == 200) {
                        o.innerHTML = xhr.responseText;
                        if (typeof success == 'function') success.call(xhr, o.innerHTML);
                    }
                    else alert('发生错误\n' + xhr.responseText);
                }
            }
            xhr.send(null);
        }
    };

    $.load('dv', '1.html', function (data) { alert('成功调用load方法\n返回值：' + data); });
    $.getJSON('1.json', function (data) { alert(data.un);alert(data.sex) });
</script>

http://www.w3cschool.cn/jquery_ref_ajax.html先看看这个

学习一下javascript的原生ajax方法就可以了。http://www.phpstudy.net/e/ajax/ajax_xmlhttprequest_create.html

此外jquery是对javascript的封装，也可以看下jquery的源码。