ajax学习。写完就记忆更为深刻了

原创 1102395550 随笔 笔记 523阅读 2017-08-25 21:52:10 举报

ajax就是前端人员必须会的一种数据交互的方法。可以实现在浏览器不经过手动刷新的方式,数据的实时更新

其实最直观的就是股票的实时情况的展示

//ajax异步请求5个步骤:

    1.创建xmlhttprequest对象 2.配置type+url等  3.open(type,url,true)方法 4.send()方法  5.onreadystatechange 状态检查

function ajax(myjson){
var type=myjson.type;
var url=myjson.url;
var success=myjson.success;
var xhr=new XMLHttpRequest();
//open() 和send()方法是将数据发送到服务器

            xhr.open(type,url,true);
            xhr.send()

            //与 POST 相比,GET 更简单也更快,并且在大部分情况下都能用。
            //然而,在以下情况中,请使用 POST 请求:
            //无法使用缓存文件(更新服务器上的文件或数据库)
            //向服务器发送大量数据(POST 没有数据量限制)
            //发送包含未知字符的用户输入时,POST 比 GET 更稳定也更可靠
            xhr.onreadystatechange=function(){
                if(xhr.status==200&&xhr.readyState==4){
                    success(xhr.response);
                    }
                }
        }
        var  str=''
        ajax({
            type:'GET',
            url:'data.php',
            data:'',
            success:function(msg){
                //把拿到的json字符串变成json对象
                var result= JSON.parse(msg);
                //创建li标签
                var oli=document.createElement('li');
                for (var j=0;j<result[i].length;j++) {
                    //遍历所有的数组
                    str+='<li><a href='+result[i][j].url1+'><b>'+result[i][j].title+'</b></a><a href='+result[i][j].url2+'>'+result[i][j].dec+'</a></li>'
                    oul.innerHTML=str;
                }

            }

        });
评论 ( 0 )
最新评论
暂无评论

赶紧努力消灭 0 回复