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. 手把手教你开发jquery插件

    I have said that i dislike jQuery UI’s unified API, so i want to get the instance of the component a ...

  2. English trip -- VC(情景课) 6 C Is your class at 11:00? 你的课11点开始吗?

    Grammar focus 语法点 Is your class  at 11:00 ?  # 带be动词的一般疑问句 Yes, it is No, it isn't   相当于 is not  Pra ...

  3. UVA557 汉堡 Burger

    题面 https://www.luogu.org/problemnew/show/UVA557 这里顺便整理一下二维格点随机游走问题. 遇到这种问题时,需注意分母的计算问题. 设x为起点到终点的距离. ...

  4. nyoj1248(阅读理解???)

    海岛争霸 时间限制:1000 ms  |  内存限制:65535 KB 难度:3   描述 神秘的海洋,惊险的探险之路,打捞海底宝藏,激烈的海战,海盗劫富等等.加勒比海盗,你知道吧?杰克船长驾驶着自己 ...

  5. UVA-10127 Ones (数论)

    题目大意:给一个数n,找出一个各位全是1的最小的十进制数,使得n能整除这个数.只输出最小位数. 题目分析:纯粹是数论,暴力. 代码如下: # include<iostream> # inc ...

  6. 图片上传--Upload

    图片上传--Upload 图片上传基于spring框架写的代码: 1.首先:我们要再springmvc中添加试图解析器: <!-- 图片解析器 --> <bean id=" ...

  7. 使用GAN进行异常检测——可以进行网络流量的自学习哇,哥哥,人家是半监督,无监督的话,还是要VAE,SAE。

    实验了效果,下面的还是图像的异常检测居多. https://github.com/LeeDoYup/AnoGAN https://github.com/tkwoo/anogan-keras 看了下,本 ...

  8. 简话Angular 06 Angular自定义指令

    一句话: 直接return link函数可以解决大多数问题,无须死扣用法 1. 上源码 (dom操作,事件,css,mode操作全包括了) <h3>Custom directive, wi ...

  9. hdu3874

    题解: 和上一题基本相同 插入的时候变一下数值 具体看http://www.cnblogs.com/xuanyiming/p/7921926.html 代码: #include<cstdio&g ...

  10. bzoj3040

    题解: 模板题,地界特斯拉+堆优化 注意第一种建边 代码: #include<bits/stdc++.h> using namespace std; typedef long long l ...