1.前台页面

<form action="#" method="post">

  姓名<input type="text" name="first" id="first" />

  <span id="show"></span>

</form>

action="#" 是提交到本个页面内

2.在head标签元素加入AJAX代码

其实这个AJAX功能即是这个check(str)函数

这个函数的功能即是:传入一个字符串HELLO到后台服务器中,后台的程序经过处理之后(假设这个程序的功能即是大写转换成小写)再把hello传给这个函数,然后这个函数负责把这个responseTest   hello插入到innerHTML文档之中

这个实现AJAX的函数功能即是:传入字符串HELLO -------用open或者send方法把这个HELLO传到后台的处理程序

----后台处理程序把大写换成小写hello------然后这个函数用document.getElementById("show").innerHTML=x.responseText;把处理好的hello插入到HTML页面之中

去讯和面试第一次听说阿贾克斯,本质就是一个函数,和后台交互的函数

<script type="text/javascript">

    function check(str){

    if(window.XMLHttpRequest){
var x=new XMLHttpRequest(); //创建对象x
}else{
var x=new ActiveXObject("Microsoft.XMLHTTP");
} x.open("GET","test2.php?c="+str+"&q="+new Date(),true);//open方法客户端准备发送给test2.php处理
x.send(); //客户端发送。这2步就是请求request x.onreadystatechange=function ff(){
if(x.readyState==4 && x.status==200){//客户端判断条件
//客户端显示
document.getElementById("show").innerHTML=x.responseText;
}
}
}
</script>

3.后台程序

<?php
if($_GET["c"]==""){ //如果$_GET["c"]为空
echo "empty"; //就输出empty
}else{ //否则
echo $_GET["c"]; //输出发送过来的数据
}
?>

初学者必读原生AJAX-异步的javaScript和XML的更多相关文章

  1. AJAX = Asynchronous JavaScript and XML(异步的 JavaScript 和 XML)。

    AJAX = Asynchronous JavaScript and XML(异步的 JavaScript 和 XML). AJAX 不是新的编程语言,而是一种使用现有标准的新方法. AJAX 最大的 ...

  2. AJAX异步的 JavaScript

    什么是AJAX: AJAX = Asynchronous JavaScript and XML(异步的 JavaScript 和 XML). AJAX 不是新的编程语言,而是一种使用现有标准的新方法. ...

  3. 原始的Ajax方法 (异步的 JavaScript 和 XML -- (Extensible Markup Language 可扩展标记语言))

    <script language="javascript" type="text/javascript"> var request = false; ...

  4. 什么是AJAX? AJAX:”Asynchronous JavaScript and XML”中文意思:异步JavaScript和XML。

    指一种创建交互式网页应用的网页开发技术. AJAX并非缩写词,而是由Jesse James Gaiiett创造的名词. 不是指一种单一的技术,而是有机地利用了一系列相关的技术: web标准( Stan ...

  5. Ajax(Asychronous JavaScript and XML)笔记

    1 Ajax简介 1 ajax概念 2 什么是同步?什么是异步? 3 ajax原理 2 JavaScript原生的ajax 1 ajax.html代码 <!DOCTYPE html> &l ...

  6. ajax(Asynchronous JavaScript and XML) 异步js或者xml

    1.XMLHttpRequest 对象:向服务器发送局部的请求,异步获取执行 a.浏览器支持 b.语法: xmlhttp==new XMLHttpRequest(); xmlhttp.open(&qu ...

  7. 初学者必读之AJAX简单实例2

    1.a前台页面的主体 b.添加script函数: 这个函数功能1:把文本框的数据传入到后台程序   2.再接收后台程序处理之后的数据,将其插入到页面 2.后台程序功能 软件测试

  8. 原生 Ajax 封装 和 Axios 二次 封装

    AJAX 异步的JavaScript与XML技术( Asynchronous JavaScript and XML ) Ajax 不需要任何浏览器插件,能在不更新整个页面的前提下维护数据,但需要用户允 ...

  9. 用javascript写原生ajax(笔记)

    AJAX  的全名叫做  Asynchronous JavaScript and XML(异步的 JavaScript 和 XML).它最大的优点是在不重新加载整个页面的情况下,可以与服务器交换数据并 ...

随机推荐

  1. 雷林鹏分享:Ruby 数据类型

    Ruby 数据类型 本章节我们将为大家介绍 Ruby 的基本数据类型. Ruby支持的数据类型包括基本的Number.String.Ranges.Symbols,以及true.false和nil这几个 ...

  2. 3.5 MIPS体系结构

    计算机组成 3 指令系统体系结构 3.5 MIPS体系结构 MIPS是精简指令系统的代表,采用了与X86相反的设计理念,并引领了精简指令系统的潮流,那就让我们一起来看一看这究竟是怎么一回事. 要探讨M ...

  3. synchronized同步代码块锁释放

    今天发现自己写的线上程序出现数据库不能同步的问题,查看日志已经停止记录,随后使用jstack查看线程的运行状况,发现有个同步线程锁住了. 以下是jstack -l 637  问题线程的内容. &quo ...

  4. Android 7.0正式版工厂镜像下载

    Android 7.0正式版工厂镜像下载 从3月份上线首个开发者预览版(Developer Preview)之后,经过近6个月时间的打磨,谷歌今天开始向Nexus设备推送Android 7.0 Nou ...

  5. HDOJ1005

    #include "iostream" using namespace std; int fun(int A,int B,int n) { ,y = ,z; || n == ) ; ...

  6. Windows系统下修改Erlang默认路径

    新建.erlang文件: io:format("consulting .erlang in ~p~n",[element(2, file:get_cwd())]). c:cd(&q ...

  7. git HEAD游离状态问题解决

    最近在迭代一个版本的时候,出现 HEAD detached at xxx 提示,应该是我切换分支的时候,哪里没弄对.   那么可以通过如下办法解决 git checkout 05 # 先checkou ...

  8. docker官方windows安装

    https://docs.docker.com/engine/installation/windows/

  9. 一个Flex 对话框的坑

    最近在项目中遇到一个问题,在Flex中使用Alert.show("this is content!", "title");发现对话框可以弹出来,但是文本始终不显 ...

  10. Solrj调用Solr API

    在MyEclipse下的SSH项目,要调用Solr接口进行操作. 1.先运行solr 2.在已搭建好的SSH项目中用Solrj调用Solr的接口 3.导入如下solr的jar包到搭建好的SSH项目的W ...