学习Ajax教程,详细了解Get与Post
Get方式:
作用:可传送简单数据
大小:url最大长度是2083 bytes,可以用于GET传递数据的长度是2048 bytes
包含体:数据追加到url中发送,也就是http的header传送
Post方式:
作用:可传送简单复杂数据
大小:web.config里限制
包含体:数据在http请求的实体内容里传送
Ajax用Post模式传送数据.需注意:
1.设置header的Context-Type为application/x-www-form-urlencode确保服务器知道实体中有参数变量.通常使用XmlHttpRequest对象的
SetRequestHeader("Context-Type","application/x-www-form-urlencoded;")
2.参数是名/值一一对应的键值对,每对值用&号隔开.如 name=abc&sex=man&age=18.
3.参数在Send(参数)方法中发送
4.服务器端请求参数区分Get与Post.例如asp.net中以Request.Form["name"]对实体中的参数请求.这时url参数请求Request.QueryString["name"]将引发异常
<javascript type="text/javascript" language="javascript" >
function CreateXmlHttp()
{
if(window.ActiveXObject)
{
return new ActiveXObject("Microsoft.XMLHTTP");
}
else if (window.XMLHttpRequest)
{
return new XmlHttpRequest();
}
}
//---------------------------------------------------------------------------------------------------------------------
//post方式:
function Start()
{
var ParamString = "name=abc&sex=man&age=18";
var XmlHttpObject = CreateXmlHttp();
XmlHttpObject.onreadystatechange = StateEvent;
XmlHttpObject.open("post","test.aspx",true);
XmlHttpObject.setRequestHeader("Content-Type","application/x-www-form-urlencoded;"); //设置服务器响应请求体参数
XmlHttpObject.send(ParamString);
}
//---------------------------------------------------------------------------------------------------------------------
//get方式:
function Start()
{
var XmlHttpObject = CreateXmlHttp();
XmlHttpObject.onreadystatechange = StateEvent;
XmlHttpObject.open("get",url,true);
XmlHttpObject.send(null);
}
//---------------------------------------------------------------------------------------------------------------------
//创建回调函数
function StateEvent()
{
if(http_request.readyState==4)//服务器响应状态
{
if(http_request.status==200|| http_request.status == 304)//代码执行状态
{
var resStr=http_request.responseText;
alert(resStr);//这里再处业务逻辑处理
}
else
{
alert("您所请求的页面有异常!");
}
}
else
{
selectedResTits.innerHTML="<img src='images/wjb/icons/indicator.gif' alt=''/>";
}
}
</script>
function CreateXmlHttp()
{
if(window.ActiveXObject)
{
return new ActiveXObject("Microsoft.XMLHTTP");
}
else if (window.XMLHttpRequest)
{
return new XmlHttpRequest();
}
}
//---------------------------------------------------------------------------------------------------------------------
//post方式:
function Start()
{
var ParamString = "name=abc&sex=man&age=18";
var XmlHttpObject = CreateXmlHttp();
XmlHttpObject.onreadystatechange = StateEvent;
XmlHttpObject.open("post","test.aspx",true);
XmlHttpObject.setRequestHeader("Content-Type","application/x-www-form-urlencoded;"); //设置服务器响应请求体参数
XmlHttpObject.send(ParamString);
}
//---------------------------------------------------------------------------------------------------------------------
//get方式:
function Start()
{
var XmlHttpObject = CreateXmlHttp();
XmlHttpObject.onreadystatechange = StateEvent;
XmlHttpObject.open("get",url,true);
XmlHttpObject.send(null);
}
//---------------------------------------------------------------------------------------------------------------------
//创建回调函数
function StateEvent()
{
if(http_request.readyState==4)//服务器响应状态
{
if(http_request.status==200|| http_request.status == 304)//代码执行状态
{
var resStr=http_request.responseText;
alert(resStr);//这里再处业务逻辑处理
}
else
{
alert("您所请求的页面有异常!");
}
}
else
{
selectedResTits.innerHTML="<img src='images/wjb/icons/indicator.gif' alt=''/>";
}
}
</script>
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 从 HTTP 原因短语缺失研究 HTTP/2 和 HTTP/3 的设计差异
· AI与.NET技术实操系列:向量存储与相似性搜索在 .NET 中的实现
· 基于Microsoft.Extensions.AI核心库实现RAG应用
· Linux系列:如何用heaptrack跟踪.NET程序的非托管内存泄露
· 开发者必知的日志记录最佳实践
· winform 绘制太阳,地球,月球 运作规律
· AI与.NET技术实操系列(五):向量存储与相似性搜索在 .NET 中的实现
· 超详细:普通电脑也行Windows部署deepseek R1训练数据并当服务器共享给他人
· 【硬核科普】Trae如何「偷看」你的代码?零基础破解AI编程运行原理
· 上周热点回顾(3.3-3.9)