如何在JS中编写Ajax

发布日期:2020年9月8日 20:05 星期二

  • 正文内容
  • 相关推荐

js中怎么写ajax

 

在JavaScript中使用ajax有两个作用:

1.让js去读服务器上面的数据.

2.无刷新的情况下读取服务器上面的数据,例如:验证账号和密码是否正确等.

对于网络请求我们知道有Get 和Post两种,它们之间的区别是什么呢?

get方式:常见的表单提交方式:将值在url后面提交;?名字=值&名字=值格.

提交表单例子:

<form  action="www.baidu.com " method="get" (默认是get方式)>

姓名:<input type="text" name="userName"></br>

密码:<input type="password" name="password">

<input type="submit" value="提交">

</from>

区别:

1.get方式是通过网址进行传递数据的,post是通过http中Content进行传递的.

2.get容量小,不适合传递大数据,(一般4k-10k),post方式容量相对大很多,一般服务器可以达到2G容量.

3.对于太大的文件,就不会走post,走控件.

4.get方式安全性差,post相对来说会好一点,一帮安全只能走https.

5.get方式是有缓存的,post没有缓存. get更适合向服务器获取数据,post更适合向服务器传递数据,

在JS中AJAX的两种写法:

GET方式:

var ajaxObj=new XMLHttpRequest();

ajaxObj.open("GET","../php/ajaxSubmitData.php?data=tody is wind");

ajaxObj.send()

ajaxObj.onreadystatechange= function () {

    if(ajaxObj.readyState===4&&ajaxObj.status){

        alert("发送成功");    

    }

}

POST方式:

var ajaxObj=new XMLHttpRequest();

ajaxObj.open("POST","../PHP/ajaxSubmitData.php");

ajaxObj.setRequestHeader("Content-type","application/x-www-form-urlencoded");

// multipart/form-data 默认的以二进制方式传送

ajaxObj.send("data=我是post数据");

ajaxObj.onreadystatechange= function ()

if(ajaxObj.readyState===4&&ajaxObj.status===200){

alert("发送数据成功");

}

}

ajax获取从服务器返回的数据是 ajaxObj.responseText获取

ajax 给服务器发送数据: get post

get: url重写(拼接) ---- 数据量小 简单数据 不安全

post:send(数据) 请求体(页面看不到) 数据量大 简单或复杂数据 安全

application/x-www-form-urlencoded表示表单默认以字符串的形式发送

multipart/form-data 表单数据以二进制流的方式发送

ajaxObj.setRequestHeader其实就是修改请求头(请求报文)里面的额Content-type值

趣乐分享-趣乐资源网
如有密码均为:www.itql.cn
学到东西应该懂得感恩作者 无脑喷子永封IP段+删帐号所有评论
本站资源软件和源码 文章大部分为网上收集,如侵犯您的权利,请告知管理员,我们会及时删除,并向您赔礼道歉.

站长QQ:209993299  

作者资料
描述: 90后草根站长!不忘初心,方得始终!

本文标签:

文章标题:如何在JS中编写Ajax

文章链接:https://www.itql.cn/post-3662.html

版权声明:若无特殊注明,本文皆为《钱哆哆》原创,转载请保留文章出处。