day13-json、ajax、cookie、RegExp

1、json和jQuery交互

<script src="./js/json2.js"></script> // 兼容低版本的i.e.
var str01 = '{"name":"xiaoming","age":18,"like":["chi","he"]}’; // 字符串类型的json数据
var oStr01 = JSON.parse(str01); //字符串变成对象
var person01 = {name: "xiaoming",age: 18}; // jQuery中的对象
var strperson01 = JSON.stringify(person01); // jQuery中的对象转json数据

2、ajax

2.1、ajax的使用格式一

$.ajax({
    url:”data.json”,
    type:”get”,
    dataType:”json”,
    data:{“name”:”xiaoming”},
    success:function(data){
        console.log(“success—>”, data);
    },
    error:function(){
        console.log(“error");
    }
});

2.2、ajax的使用格式二

$.ajax({
    url:”data.json”,
    type:”get”,
    dataType:”json”,
    data:{“name”:”xiaoming”},
}).done(function(data){
    console.log(“done—>”,data);
}).fail(function(){
    console.log(“fail...");
});

3、ajax跨域问题
本机地址： http://192.168.79.58:8888 // http:不同， ip不同，8888不同，都算跨域
script中是可以跨域的，比如<script src="http://code.jquery.com/jquery-1.4.1.min.js"></script>和<img src="https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=3519309645,3088241677&fm=27&gp=0.jpg" alt="">中的src明显就是不同域的。
跨域限制 是ajax内部限制 script标签没有跨域问题

假设现在要请求360搜索数据：
网站的地址栏是：// https://sug.so.360.cn/suggest?callback=suggest_so&encodein=utf-8&encodeout=utf-8&format=json&fields=word&word=he
在程序中写的ajax请求是：

$.ajax({
    url:”https://sug.so.360.cn/suggest”,  // 也就是地址栏中问好之前的部分
    type:”get”,
    dataType:”jsonp”,  // 跨域bug解决方案
    data:{“word”:”he”},
    jsonpCallback:”fnHaha”    // 指定方法的名字,不指定的时候就会默认生成
}).done(function(data){
    console.log(data);
}).fail(function(){
    console.log(“fail”);
});

function fuHaha(data){  // 不指定的时候，自动创建一个方法 方法的名字是自动生成的 每次都不一样
    console.log(“fuHaha—>”,data);
}

4、cookie

导包：<script src="./js/jquery.cookie.js"></script>
$.cookie("name", “xiaoming”); // 写入一条cookie数据
$.cookie(“name”,”xiaoming”,{expires:10}); // 写入一条有效期为10天的数据，有效期也可以用小数表示，如果不写有效期 服务器关闭就消失了
$.cookie(“name”,”xiaoming”,{expires:0.5, path:”/haha”}); // 有效期12小时，限制了访问路径
存放的根路径 子级能访问 存在子级路径 父级无法访问
var name = $.cookie("name");//获取cookie 要在服务器环境下

5、localStorage 和 sessionStorage

localStorage.setItem(“name1”, “xiaohong”);// 5m 有效期 无限 html5
localStorage.setItem(“name2”, “laowang”);
var name2 = localStorage.getItem(“name2”); // 获取一条数据
localStorage.removeItem(“name2”); 删除一条
localStorage.clear();//全部删除
sessionStorage；5m 有效期 关闭浏览器就没了

6、js中正则的使用

var reg01 = new RegExp(“^a[a-zA-Z0-9]+S$”); // 生成正则对象
var reg01 = /abc/; //生成正则对象
var reg01 = /abc/i; //i忽略大小写
var reg02 = /a/gi; //global 匹配全部
reg01.test(str01); // 判断是否匹配上， 使用场景一
str02.replace(reg02, “*”); // 字符串替换，正则的使用场景二
var str03 = str02.match(reg02); // 提取匹配上的字符串，正则使用场景三