Js+Ajax,Get和Post在使用上的区别小结

 更新时间:2016年06月08日 10:34:05   投稿:jingxian  
下面小编就为大家带来一篇Js+Ajax,Get和Post在使用上的区别小结。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧

get和post方法最大的不同在于:

1.get方法传值参数在url里面,而post参数放send里面

2.post方法必须加上

xmlHttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");

下面实例可以看get方法

xmlHttp.open("GET","for.php?text="+url,true); 

在post里面表现为:

xmlHttp.open("POST","for.php",true); 
xmlHttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");

POST和GET方法共用文件

index.php

<script src="a.js" type="text/javascript"></script>
<a href="#" onClick="funphp100('o')">o</a>
<a href="#" onClick="funphp100('t')">t</a>
<a href="#" onClick="funphp100('x')">x</a>
<div id="php100"></div>

POST方法文件:

 a.js

var xmlHttp;    
function S_xmlhttprequest(){ 
 if(window.ActiveXObject){ 
 xmlHttp=new ActiveXObject('Microsoft.XMLHTTP');
 }else if(window.XMLHttpRequest){ 
  xmlHttp=new XMLHttpRequest();
  }
 }
 
function funphp100(n){
var data = "text=" +n;  //多个参数的,往后加
 S_xmlhttprequest();
xmlHttp.open("POST","for.php",true); 
xmlHttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
 xmlHttp.onreadystatechange=byphp;
 xmlHttp.send(data);
 }
 
function byphp(){
var byphp100=xmlHttp.responseText;
document.getElementById("php100").innerHTML=byphp100;
 }

for.php:

<?
echo $_POST['text'];
?>

GET方法文件:

a.js:

var xmlHttp;    
function S_xmlhttprequest(){ 
 if(window.ActiveXObject){ 
 xmlHttp=new ActiveXObject('Microsoft.XMLHTTP');
 }else if(window.XMLHttpRequest){ 
  xmlHttp=new XMLHttpRequest();
  }
 }
 
 
function funphp100(url){
 S_xmlhttprequest();
xmlHttp.open("GET","for.php?text="+url,true); 
 xmlHttp.onreadystatechange=byphp; 
 xmlHttp.send(null);
 }
 
function byphp(){
var byphp100=xmlHttp.responseText;
document.getElementById("php100").innerHTML=byphp100;
 }

for.php:

<?
echo $_GET['text'];
?>

以上这篇Js+Ajax,Get和Post在使用上的区别小结就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持脚本之家。

相关文章

  • JavaScript实现的超简单计算器功能示例

    JavaScript实现的超简单计算器功能示例

    这篇文章主要介绍了JavaScript实现的超简单计算器功能,可实现基本的四则运算并带有验证功能,代码中备有较为详尽的注释便于理解,需要的朋友可以参考下
    2017-12-12
  • JSON 数据详解及实例代码分析

    JSON 数据详解及实例代码分析

    这篇文章主要介绍了JSON 数据详解及实例代码分析的相关资料,需要的朋友可以参考下
    2017-01-01
  • 微信小程序实现手写签名功能

    微信小程序实现手写签名功能

    微信小程序实现手写签名功能的步骤详解,包括技术选型、实现步骤、优化与拓展以及常见问题解答,感兴趣的朋友跟随小编一起看看吧
    2025-01-01
  • JS设计模式之建造者模式的使用方法详解

    JS设计模式之建造者模式的使用方法详解

    JS建造者模式是一种创建型设计模式,它可以用于构建复杂对象的创建过程,将对象的构建步骤和表示分离,以便能够灵活地构建不同的对象,本文将通过代码示例给大家详细的介绍一下JS建造者模式的用法,需要的朋友可以参考下
    2023-08-08
  • JavaScript获取Excel表格的列序号和列名

    JavaScript获取Excel表格的列序号和列名

    这篇文章主要介绍了JavaScript获取Excel表格的列序号和列名,在处理Excel文件时,通常要获取xx列的数据,这就要求先找到列序号,下文关于列名获取需要的小伙伴可以参考一下
    2022-05-05
  • 前端js sm2实现加密简单代码举例

    前端js sm2实现加密简单代码举例

    在Vue项目中实现数据加密,首先需要安装SM2加密库,如js-sm2或sm-crypto,通过npm或yarn进行安装后,在Vue组件或文件中引入该库,并使用其提供的加密、解密功能,文中通过代码介绍的非常详细,需要的朋友可以参考下
    2024-09-09
  • 在JavaScript中构建ArrayList示例代码

    在JavaScript中构建ArrayList示例代码

    这篇文章主要介绍了在JavaScript中构建ArrayList,很实用,需要的朋友可以参考下
    2014-09-09
  • 主页面中的两个iframe实现鼠标拖动改变其大小

    主页面中的两个iframe实现鼠标拖动改变其大小

    iframe实现鼠标拖动改变其大小在一个页面中的两个iframe的情况下,此方法相当实用,感兴趣的各位不妨参考下,或许对你有所帮助
    2013-04-04
  • JavaScript-定时器0~9抽奖系统详解(代码)

    JavaScript-定时器0~9抽奖系统详解(代码)

    这篇文章主要介绍了 JavaScript-定时器0~9抽奖系统,通过代码实例说明函数调用的整体操作,具体步骤大家可查看下文的详细讲解,感兴趣的小伙伴们可以参考一下。
    2017-08-08
  • js实现键盘Enter键提交表单的方法

    js实现键盘Enter键提交表单的方法

    这篇文章主要介绍了js实现键盘Enter键提交表单的方法,涉及javascript键盘事件的相关操作技巧,需要的朋友可以参考下
    2015-05-05

最新评论