美文网首页
AJAX小结

AJAX小结

作者: 霁雨轩阁 | 来源:发表于2017-12-09 22:03 被阅读0次

1.AJAX 是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术。
2.AJAX = 异步 JavaScript 和 XML。
3.AJAX 是一种用于创建快速动态网页的技术。
4.AJAX 的应用程序案例:新浪微博、Google 地图、开心网等等

一 对象的创建
var xmlhttp;
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}

二 异步判断
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
}

三 XMLHttpRequest 对象的 responseText 或 responseXML 属性

  1. document.getElementById("myDiv").innerHTML=xmlhttp.responseText;//获得字符串形式的响应数据
  2. xmlDoc=xmlhttp.responseXML;//获得 XML 形式的响应数据
    txt="";
    x=xmlDoc.getElementsByTagName("ARTIST");
    for (i=0;i<x.length;i++)
    {
    txt=txt + x[i].childNodes[0].nodeValue + "<br />";
    }
    document.getElementById("myDiv").innerHTML=txt;

四 向服务器发送请求
xmlhttp.open("method "," url ", async);
xmlhttp.send(string);

method:请求的类型;GET 或 POST
url:文件在服务器上的位置
async:true(异步)或 false(同步)

只有当method设置post时,send用string

五。通过jQuery实现加载后台数据
$("div").load(URL,data,callback)
必需的 URL 参数规定您希望加载的 URL。
可选的 data 参数规定与请求一同发送的查询字符串键/值对集合。
可选的 callback 参数是 load() 方法完成后所执行的函数名称。

    callback的用法
    $("button").click(function(){

$("#div1").load("demo_test.txt",function(responseTxt,statusTxt,xhr){
if(statusTxt=="success")
alert("外部内容加载成功!");
if(statusTxt=="error")
alert("Error: "+xhr.status+": "+xhr.statusText);
});
});

    $.get(URL,callback);
    必需的 URL 参数规定您希望请求的 URL。
    可选的 callback 参数是请求成功后所执行的函数名。

    $.post(URL,data,callback);
    必需的 URL 参数规定您希望请求的 URL。
    可选的 data 参数规定连同请求发送的数据。
    可选的 callback 参数是请求成功后所执行的函数名。

相关文章

  • ajax小结

    1.创建对象 XMLHttpRequest 用于在后台与服务器交换数据。这意味着可以在不重新加载整个网页的情况下,...

  • ajax小结

    在开发过程中ajax是必须的,对近期在ajax的使用上的心得进行总结。 一、关于ajax AJAX = Async...

  • ajax小结

    在平时的开发项目中,难免接触前端的知识,需要写接口,有时候用到js中的ajax跨越请求,总结了ajax的写法。 开...

  • AJAX小结

    1.AJAX 是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术。2.AJAX = 异步 JavaScr...

  • AJAX小结

    首先要明确一个问题,AJAX是什么,为什么要用AJAX? Q1:什么是AJAX A1:AJAX==>Asynchr...

  • Ajax 基础小结

    AjaxStudyNote (E:\Video_Tutorials\Java自学视频\尚硅谷JavaEE培训\6W...

  • 小结--ajax的封装

    在前后端的交互过程中,ajax是一个常用的手段,但是其使用方法比较繁琐,所以封装一个惯用的方法。通常前后端交互的方...

  • 前端课程小结-Ajax

    ajax2.0比ajax1.0:1.formData: 控制提交数据、文件上传,服务器那边跟普通 一样的2.cor...

  • 【小结】AJAX和JSON

    AJAX:Asynchronous Javascript And XML”(异步 JavaScript 和 XML...

  • axios使用回顾

    .axios 使用小结 axios 在vue框架中用于向服务器请求数据,之前了解过一点jQuery 的AJAX 。...

网友评论

      本文标题:AJAX小结

      本文链接:https://www.haomeiwen.com/subject/shipixtx.html