Ajax全接触(2)

梦里梦外; 2022-06-09 11:38 127阅读 0赞

##  ##

### Json基本概念 ###

JSON：JavaScript对象表示法，全称：JavaScript Object Notation
    1、JSON是存储和交换文本信息的语法，类似XML。它采用键值对的方式来组织数据，易于人们阅读和编写，同时也易于机器解析和生成
    2、JSON是独立于语言的，任何语言都可以按照json的规则来解析
    JSON与XML比较：
    1、json的长度比xml短小
    2、json的读写速度更快
    3、json可以使用JavaScript内置的方法直接进行解析并转换成JavaScript对象，很方便
    JSON语法规则：
    1、json数据的格式是："名称":值形式的键值对，名称需要在双引号中，中间以冒号":"隔开；
    2、json的值可以是以下类型：
    数字（整数和浮点数）
    字符串（在双引号中）
    逻辑值（true或false）
    数组（在方括号中[]）
    对象（在花括号中{}）
    null

### Json解析,格式化,校验工具 ###

json解析的方法有两种：eval()和parse()方法
     
    eval() 较危险，不光解析了字符串，还解析了js方法，无论何时用eval()都是非常危险的。-----不建议使用
    JSON.parse()较好，会解析出错误。
    //例子：首先定义了JSON字符串jsondata
    eval()方法：
    var jsondata='{"staff":[{"name":"洪七","age":70},{"name":"郭靖","age":35},{"name":"黄蓉","age":30}]}'；
    var jsonobj=veal('('+jsondata+')');
    alert(jsonobj.staff[0].name);
    parse()方法：
    var jsondata='{"staff":[{"name":"洪七","age":70},{"name":"郭靖","age":35},{"name":"黄蓉","age":30}]}'；
    var jsonobj=JSON.parse(jsondata);
    alert(jsonobj.staff[0].name);
    都可以，若把age后的70改成alert（123）；若用eval()方法，发现页面是先弹出123，再弹出洪七；也就是说用eval不仅解析了字符串，还执行了JS里的方法
    用parse（）解析字符串，发现会抛出一个错误。
    这说明用eval()不会看json是否合法，eval非常危险。所以尽量使用JSON.parse方法，来解析json里的字符串，而且还可以解析出json里的一些错误。
     
    2、json校验工具jsonlint
    3、把json格式化，地址:jsonlint.com

### Jquery中的Ajax ###

1、在线引用（百度静态资源公共库）
    2、jq实现Ajax（代码如下，图为各属性解析）

### 处理跨域方式\--JSONP ###

JSONP  （只能对GET请求起到效果，而不能去改造post请求，即不支持post请求）
     
    前端代码两处改动：
        在get请求的代码中，
                    dataType:"jsonp",
                    jsonp:"callback123" （jsonp的值可任意写）
     
    后端代码改动：
           $jsonp = $_GET["callback123"];
           返回值加括号
           $result = $jsonp . '( { "success":false , "msg":"没有找到员工" } )';
           $result = $jsonp . '( { ……… } )';
    处理跨越方式--XHR2
    
    1、HTML5提供的XMLHttpRequest Level2已经实现了跨域访问以及其他的一些新功能
    2.IE10以下的版本都不支持
    3.在服务器端
    header('Access-Control-Allow-Origin:*');
    header('Access-Control-Allow-Methods:POST,GET');