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

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

4个回答

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

sunxd0320
sunxd0320 只是想简单的实现
大约 5 年之前 回复

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>
sunxd0320
sunxd0320 嗯就是要实现ajax的这几个方法
大约 5 年之前 回复
showbo
支付宝加好友偷能量挖 1.html内容:11111 1.json内容:{un:'showbo',sex:'male'}
大约 5 年之前 回复

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

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

Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!
立即提问