[ Javascript ] - 20140805-题目1

[ Javascript ] - 20140805-题目1

用最简短的js原生代码实现一个异步ajax请求a.txt的过程。
a.txt里边的内容为：123123.


PS:
1. 回复时注意加上下面这句话，才会有语法高亮或格式缩进。
```javascript
// you code
```
2. 粘贴代码时请使用shift+tab，缩进前面的空白。  

<input id="btn" type="button" value="test"/>
<script type="text/javascript">
    var btn = document.getElementById('btn')
    btn.onclick = function(){
        var a = ajax('a.txt', function(str){
            alert(str);
        });
    }

    function ajax(url, success, fail){
        // 1. 创建连接
        var xhr = null;
        if(window.XMLHttpRequest){
            xhr = new XMLHttpRequest()
        } else {
            xhr = new ActiveXObject('Microsoft.XMLHTTP');
        }

        // 2. 连接服务器
        xhr.open('get', url, true)

        // 3. 发送请求
        xhr.send(null);

        // 4. 接受请求
        xhr.onreadystatechange = function(){
            if(xhr.readyState == 4){
                if(xhr.status == 200){
                    success(xhr.responseText);
                } else { // fail
                    fail && fail(xhr.status);
                }
            }
        }

    }
</script>

function ajax(method, url, data, success) {
    var xhr = null;
    try {
        xhr = new XMLHttpRequest();
    } catch (e) {
        xhr = new ActiveXObject('Microsoft.XMLHTTP');
    }

    if (method == 'get' && data) {
        url += '?' + data;
    }

    xhr.open(method,url,true);
    if (method == 'get') {
        xhr.send();
    } else {
        xhr.setRequestHeader('content-type', 'application/x-www-form-urlencoded');
        xhr.send(data);
    }

    xhr.onreadystatechange = function() {

        if ( xhr.readyState == 4 ) {
            if ( xhr.status == 200 ) {
                success && success(xhr.responseText);
            } else {
                alert('出错了,Err：' + xhr.status);
            }
        }

    }
}
来源妙趣 推广下