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. 20170719xlVBASmartIndent

    Public Sub SmartIndenterProcedure() Dim OneComp As VBComponent Dim StartLine As Long, EndLine As Lon ...

  2. node搭建本地服务器

    随着前端不断发展,node基本已经成为必备,在调试的时候经常需要服务器,在之前的做法通常是去下载一个phpstudy 或者 xampp等启动一个服务,作为一个前端人虽然可以借助各种工具,但是怎么能不懂 ...

  3. nyoj-310-河南省第四届省赛题目-二分+dinic

    SECRET 时间限制:3000 ms  |  内存限制:65535 KB 难度:6   描述 Dr.Kong is constructing a new machine and wishes to ...

  4. UVA-1220 Party at Hali-Bula (树的最大独立集)

    题目大意:数的最大独立集问题.特殊在要求回答答案是否唯一. 题目分析:定义状态dp(i,1),dp(i,0)分别表示以i为根节点的子树选不选i最多可选的人数,f(i,1),f(i,0)分别表示以i为根 ...

  5. Mac XMind8 保存时报错

    错误提示 截图 日志 查看错误日志的方式:打开xmind –> 关于xmind –> 安装细节 –> 选项卡 “配置” –> 查看错误日志 看到有Caused by: org. ...

  6. C#图片转换成二进制流并且保存到sql server数据库

    注意:我要存储文件二进制流的列的类型是text,不是image类型. 我已经实现了从数据库中读取text类型的二进制流,,现在就是不知道怎么存进去. 我的部分关键代码: StreamReader sr ...

  7. 处理Oracle EBS R12登录首页跳转出现unexpected error问题(转)

    原文地址: 处理Oracle EBS R12登录首页跳转出现unexpected error问题 经上网搜索,造成此问题的问题有很多,如内存不足.系统参数配置不当.程序代码.系统表空间不足等原因.查询 ...

  8. Oracle12c中性能优化&amp;功能增强新特性之重大突破——内存列存储新特性

    内存列存储(IM column store) 是Oracle12.1.0.2版本的主要特点.该特点允许列,表,分区和物化视图在内存中以列格式存储,而不是通常的行格式.数据存在内存中的好处显而易见,而列 ...

  9. SSH 远程端口转发

    既然"本地端口转发"是指绑定本地端口的转发,那么"远程端口转发"(remote forwarding)当然是指绑定远程端口的转发. 还是接着看上面那个例子,ho ...

  10. java标号

    标号用于控制循环执行流程: public static void main(String[] args) { mark: for(int i = 0; i < 3; i++) { System. ...