初学ajax

ajax出现无疑改变了web应用:从开始的整体页面的刷新到局部页面的数据显示,不用刷新页面就可以与服务器交互;

初学ajax
1 function ajaxPost(data){
 2
 3 var xhr=new XMLHttpRequest();
 4 xhr.open("POST",url);
 5 xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded")
 6 xhr.send(data)
 7
 8
 9
10
11
12 }

View Code

这段是现在ajax技术应用post的发送数据;真正的响应服务器的数据是在异步调用函数是发生的

function response(callback){
     var xml=new XMLHttpRequest();/*获取XMLHttpRequest对象*/
     xml.open("get",url,true);/*这里的open打开的是交互地址;接受三个参数;(第一个参数是指定http方法或动作,第二个请求地址,第三个是否异步)*/
     xml.onreadystatechange=callback;/*异步调用需要监听readystatechange事件*/
     xml.send();/*发送主体这里为空*/

}这里的两段代码其实都是差不多,只是发送和取得响应的区别;主要就是
要获取window.XMLHttpRequest对象;在Ie中他是一个ActiveX对象;可以模拟new XMLHttpRequest():
if(window.XMLHttpRequest=='undefined')
{
    window.XMLHttpRequest=function()
    {
        return new ActiveXObject('Microsoft.XMLHTTP');

    }

}

undefined

上面的代码看起来有点混乱这边在梳理一下:
/*先说ajax post发送数据,然后获取响应*/
function postDate(data,callback)
{
    var xml=new XMLHttpRequest();
    xml.open("method",url);/*这里的method是两种http方法:get||post*/
    xml.setRequestHeader("Content-Type","text/plain,charset=utf-8")/*post请求要去设置请求头;指定请求主题的MIME类型*/
    xml.onreadystatechange=function()
    {
        xml.readyState==4&&callback(xml.responseText)

    }
    xml.send(data);

}
/*get发送数据就改变一下发送方法;数据信息包含在请求地址*/

Original: https://www.cnblogs.com/isFinite-rs/p/6777829.html
Author: caibird_bg
Title: 初学ajax

原创文章受到原创版权保护。转载请注明出处:https://www.johngo689.com/610333/

转载文章受原作者版权保护。转载请注明原作者出处!

(0)

大家都在看

  • IOC Unity

    控制反转(Inversion of Control,缩写为IoC),是面向对象编程中的一种设计原则,可以用来减低计算机代码之间的耦合度。其中最常见的方式叫做依赖注入(Depende…

    Linux 2023年6月13日
    0102
  • 来的随笔

    感谢各位 posted @2022-01-07 12:08 三途河畔人 阅读(71 ) 评论() 编辑 Original: https://www.cnblogs.com/sthp…

    Linux 2023年6月7日
    0107
  • 有道词典翻译功能数字有时无法翻译出来解决方案

    阅文时长 | 0.03分钟字数统计 | 62.4字符主要内容 | 1、引言&背景 2、解决方案 3、声明与参考资料『有道词典翻译功能数字有时无法翻译出来解决方案』 编写人 …

    Linux 2023年6月14日
    0192
  • 高速USB转4串口产品设计-RS485串口

    基于480Mbps 高速USB转8路串口芯片CH344Q,可以为各类主机扩展出4个独立的串口。CH344芯片支持使用操作系统内置的CDC串口驱动,也支持使用厂商提供的VCP串口驱动…

    Linux 2023年6月7日
    0108
  • 小白上手Linux系统Redis安装与部署教程

    一:Redis的安装 1.首先需要下载linux版的redis,官网地址:http://redis.io/download。 2.创建文件夹 mkdir+文件名 3.用ftp将压缩…

    Linux 2023年6月13日
    0137
  • Dockerfile 使用 SSH docker build

    如果在书写 Dockerfile 时,有些命令需要使用到 SSH 连接,比如从私有仓库下载文件等,那么我们应该怎么做呢? Dockerfile 文件配置 为了使得 Dockerfi…

    Linux 2023年6月7日
    093
  • 搭建Nginx七层反向代理

    基于https://www.cnblogs.com/Dfengshuo/p/11911406.html这个基础上,在来补充下七层代理的配置方式。简单理解下四层和七层协议负载的区别吧…

    Linux 2023年6月8日
    0121
  • Spring Session Redis

    http://www.infoq.com/cn/articles/Next-Generation-Session-Management-with-Spring-Session Or…

    Linux 2023年5月28日
    094
  • 人人都写过的5个Bug!

    大家好,我是良许。 计算机专业的小伙伴,在学校期间一定学过 C 语言。它是众多高级语言的鼻祖,深入学习这门语言会对计算机原理、操作系统、内存管理等等底层相关的知识会有更深入的了解,…

    Linux 2023年6月14日
    0109
  • python入门基础知识六(函数)

    函数要先定义,再调用! 一、函数参数的类型: 1. 形式参数和实际参数: def funct_name(arguments): codes… codes… …

    Linux 2023年6月7日
    090
  • 10分钟轻松学会 Python turtle 绘图

    先说明一下turtle绘图的基础知识: 1. 画布(canvas) 画布就是turtle为我们展开用于绘图区域, 我们可以设置它的大小和初始位置 1.1 设置画布大小 turtle…

    Linux 2023年6月8日
    0100
  • go语言接口

    接口在底层的实现有两个部分:type 和 data。 在源码中,显式地将 nil 赋值给接口时,接口的 type 和 data 都将为 nil。此时,接口与 nil 值判断是相等的…

    Linux 2023年6月13日
    068
  • Dockerfile 构建镜像

    从 Dockerfile 构建镜像涉及三个步骤 创建工作目录 编写 Dockerfile 规格 使用 docker build 命令构建镜像 1. 创建工作目录 这个根据应用实际情…

    Linux 2023年6月6日
    0110
  • CentOS7.4安装docker

    1、安装环境 此处在Centos7进行安装,可以使用以下命令查看CentOS版本 lsb_release -a 在 CentOS 7安装docker要求系统为64位、系统内核版本为…

    Linux 2023年5月27日
    091
  • C语言:1~10阶乘的累加计算(循环方法不唯一)

    1~10阶乘的累加计算方法一 点击查看代码 int main() { int sum = 1, i, n; int ret = 0; for (n = 1; n <= 3; …

    Linux 2023年6月13日
    0105
  • 自动化集成:Jenkins管理工具详解

    前言:该系列文章,围绕持续集成:Jenkins+Docker+K8S相关组件,实现自动化管理源码编译、打包、镜像构建、部署等操作; 本篇文章主要描述Jenkins基础用法。 一、J…

    Linux 2023年5月27日
    0108
亲爱的 Coder【最近整理,可免费获取】👉 最新必读书单  | 👏 面试题下载  | 🌎 免费的AI知识星球