06_Ajax初步入门第一天

时间:2021-12-30 11:49:22

视频来源:麦子学院  讲师:李毅

  1. ajax:异步JavaScript和XML,局部刷新
  2. 原生ajax实例
    创建对象
    XMLHttpRequest对象
    request=new XMLHttpRequest();//firefox.opera,safari
    request=new ActiveXObject('Mmsxml2.XMLHTTP');//IE6+ html部分:
    <input type="button" name="btn" id="btn" value="ajax" onclick="act();"/>
    <textarea rows="10" cols="20" id="m"></textarea> js部分:
    function act(){
    var request;
    if(window.XMLHttpRequest){
    request=new XMLHttpRequest();
    }else if(window.ActiveXObject){
    request=new ActiveXObject('Microsoft.XMLHTTP');
    }else{
    alert('浏览器不支持ajax');
    return false;
    }
    request.onreadystatechange = function() {
    if (request.readyState == 4 && request.status == 200) {
    document.getElementById("m").innerHTML = request.responseText;
    }
    };
    request.open("GET", "0.txt", true);
    request.send();
    }
  3. eval()的使用
    alert('request:'+eval(prompt('请输入表达式:')));
    //在弹出的交互框中输入:2+1,eval返回值为3,alert出:request:3 //使用eval解析json字符串
    var user="{'name':'yolo','age':22}";
    var a=eval("("+user+")");
    console.log(a.name);//输出:yolo
  4. dom添加删除元素
        //dom添加元素:创建元素,找一个已存在的元素,去追加新元素
    var e=document.createElement('p');
    var node=document.createTextNode('这是新文本');
    e.appendChild(node);
    var div1=document.getElementById('div1');
    div1.appendChild(e);
    //删除元素,找到父节点,通过removeChild删除
    var div1=document.getElementById('div1');
    var p1=document.getElementById('p1');
    div.removeChild(p1);