三.ajax

4.代参数的get方法

①服务器

②ajax代码

xhr.open("get",url,true)

url="/demo/get_login?uname="+$uname+"&upwd="+$upwd

function login(){

//获取页面上用户的用户名和密码

var $uname=uname.value;

var $upwd=upwd.value;

//使用ajax访问服务器,并接受请求

//1.创建xhr异步对象

var xhr=new XMLHttpRequest();

//4.绑定监听,接受响应

xhr.onreadystatechange=function(){

if(xhr.readyState==4&&xhr.status==200){

var result=xhr.responseText;

alert(result);

}

}

//2.创建请求,打开连接

xhr.open("get","/demo/get_login?uname="+$uname+"&upwd="+$upwd,true);

//3.发送请求

xhr.send();

}

5.restful规则的接口

restful接口定义规则

/接口名称/:参数值&:参数值

注意,使用restful不能把非空验证放到后台。

而要把非空验证在前端完成

6.post传参

注意

1.xhr.send(formdata)必须带着请求主体发送

请求主体就是一个字符串

var formdata="uname="+$uname+"&upwd="+$upwd;

2.在xhr.open和xhr.send之间,设置请求头信息

把content-type设置为可以发送特殊字符

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

7.json解析

json是以js对象,或者js对象数组为表现形式字符串

json串

JavaScript object notation

js     对象  表象方式

json的来源

1.可以手写json串

var str="{'uid':123}";

2.当服务器操作数据库之后,得到的result,在传递给前端之后自动就变成一个json

①json解析

把json字符串转换成js对象/js对象数组,这个行为就叫json解析

做json解析的目的,因为要对数据,使用js的api进行处理

②json字符串的格式

1.json中用一对{}来表示一个对象

2.json中所有的属性名称,必须使用双引号括起来

使用单引号,不会发生错误,但是建议使用双引号

3.json中的属性值,如果是字符串,也要带双引号

4.整个json是一个字符串,所以最外层要是用单引号包裹

③解析语法

var arr=JSON.parse(result);

arr就是一个js的对象数组,可以使用js的数组操作模式了

8.xml解析

eXtensible markup language

可拓展的   标记    语言

所有的标签,属性都是自己定义

xml就是做数据传递的,不用于数据展示

①语法

1.首行做版本声明

<?xml version="1.0" encoding="utf-8"?>

2.xml标记,都是自己命名,只有双标记,没有单标记

3.xml标记,严格区分大小写,开始标记和结束标记必须一致

4.每个xml文档,有且只有一对根标记

②xml解析

四.ajax项目(使用restful风格)

1.login模块(后台接口,前台页面)

接口名称  /v1/login/:uname&:upwd

req.params.uname

错误总结

1.数据库没有开启

2.缺少括号

出乎意料的结尾,login这个方法未定义

说明login方法中缺少}

3.符号错误

 

总结

1.如果接口使用http的get方法

这个接口,可以使用浏览器的地址栏直接验证

注意:restful的无参数get方法,和http的无参数get方法相同

2.restful的post方法,和http的post相同

3.功能模块编写思路

前端

后端

1.收集整理数据---get,delete非空验证

2.ajax的xhr4步

3.在if(xhr.readyState==4&........)

中写dom操作,把得到响应数据呈现在html上

1.接收前端传过来的数据

2.写sql语句

3.连接池进行数据操作

4.返回的响应越短越好

AJAX三的更多相关文章

  1. 初学Ajax(三)

    $.ajax() $.ajax()是所有ajax方法中最底层的方法,所有其他方法都是基于$.ajax()方法的封装.这个方法只有一个参数,传递一个各个功能键值对的对象. $.ajax()方法对象参数表 ...

  2. ajax 三种数据格式

    1.JSON(格式要正确,可以引jar包操作) servlet代码 package com.hsp.action; import java.io.IOException; import java.io ...

  3. jQuery中Ajax(三)

    1. jQuery.ajaxSetup([options]), 设置全局 AJAX 默认选项. 参数见 'jQuery.ajax(url,[settings])' 说明. 2. jQuery.ajax ...

  4. AJAX三种返回值方式

    (一)TEXT方式 该方式返回的是拼接字符串,想要取到其中的值,需要先将返回值进行拆分 (二)JSON方式 该方式返回的是数组,想要取到其中的值,可用索引项进行提取 (三)XML方式 XML:可扩展标 ...

  5. [jquery-ajax] jquery ajax 三种情况对比

    <button class="btn1">async:false</button> <button class="btn2"> ...

  6. Ajax——三种数据传输格式

    一.HTML HTML由一些普通文本组成.如果服务器通过XMLHTTPRequest发送HTML,文本将存储在responseText属性中. 从服务器端发送的HTML的代码在浏览器端不需要用Java ...

  7. AJAX(三):GET与POST

    1.使用场景get是最常见的请求类型,最常用于向服务器查询某些信息仅次于get的是post请求,通常用于向服务器发送应该被保存的数据 2.使用get请求经常会发生一个错误,就是查询字符串的个是有问题, ...

  8. ajax 原理----初级篇

    一.贴dome,ajax三大步 <!DOCTYPE html> <html lang="en"> <head> <meta charset ...

  9. python全栈开发day50-jquery之ajax、XmlHttpRquest

    一.昨日内容回顾 1.jquery位置信息 width() ..,innetWidth() .outWidth() offset().top left scrollTop 2.事件流 DOM2级 (1 ...

随机推荐

  1. [http 1.1] M-POST

    http://www.brainbell.com/tutors/XML/XML_Book_B/Sending_Messages_Using_M_POST.htm You can restrict me ...

  2. SpringBoot中使用Fastjson/Jackson对JSON序列化格式化输出的若干问题

    来源 :https://my.oschina.net/Adven/blog/3036567 使用springboot-web编写rest接口,接口需要返回json数据,目前国内比较常用的fastjso ...

  3. Robot Framework -002 在Windows10上的安装

    机器人框架是使用Python实现的,并且还支持Jython(JVM),IronPython(.NET)和PyPy. 在安装框架之前,一个明显的前提条件是至少安装这些解释器之一. 下面列出了安装Robo ...

  4. c语言----- 冒泡排序 for while do-while 递归练习

    1. 冒泡排序简介(默认从小到大排序) 核心思想:只比较相邻的两个元素,如果满足条件就交换    5 8 2 1 6 9 4 3 7 0 目标:0 1 2 3 4 5 6 7 8 9 第一次排序: 5 ...

  5. 企业云桌面-03-安装第1个企业 CA-013-CA01

    作者:学 无 止 境 QQ交流群:454544014 注意: <企业云桌面>系列博文是<企业云桌面规划.部署与运维实践指南>的基础部分,因为书中内容涉及非常多,非常全面,所以基 ...

  6. Rancher流水线配置文档

    2019独角兽企业重金招聘Python工程师标准>>> 一.概述 Rancher流水线从逻辑上可以分为两部分,即CI和CD. CI,可分化为克隆代码.代码打包.发布镜像三部分. CD ...

  7. JavaScript面向对象那些东西-继承

    继承 父类里有些属性方法 子类想把父类中的这些属性方法 继承过来给子类自己的实例也用用 ( ps: →_→ 能不能专业点 没文化真可怕 ) 一.原型链继承 // 原型链继承:把子类的原型作为父类的实例 ...

  8. vim的四种工作模式(转载别人的)

    Vim操作的四种模式 Vim的四种模式一.启动Vim1.双击桌面的图标,就可以启动Vim(是图形界面的)2.在开始菜单---点--运行 接着输入 vim 或者gvim,就可以启动Vim或Gvim了.二 ...

  9. 【阅读笔记】Ranking Relevance in Yahoo Search (三)—— query rewriting

    5. QUERY REWRITING 作用: query rewriting is the task of altering a given query so that it will get bet ...

  10. 聊聊select, poll 和 epoll_wait

    聊聊select, poll 和 epoll 假设项目上需要实现一个TCP的客户端和服务器从而进行跨机器的数据收发,我们很可能翻阅一些资料,然后写出如下的代码. 服务端 客户端 那么问题来了,如果有一 ...