localStorage
1.localStorage
(1)setItem(key , value)，保存或设置数据 如果key已经存在，则覆盖key对应的value 如果不存在则添加key与value
window.localStorage.setItem('name','xiao');
(2)getItem(key); 获取key对应的value。 如果key不存在则返回null
window.localStorage.getItem('name');
(3)key(index); 获取指定下标位置的key
window.localStorage.key(0);
(4)length 获取localStorage一共有多少条数据 alert(window.localStorage.length); 配合key(index)方法可以实现遍历localStorage数据的方法
(5)clear(); 将同域名下的所有localStorage数据都清空
(6)removeItem('key'): 删除数据，通过key来删除相应的value
2.JS新API
(1) document.querySelector("selector"); 选择器返回第一个匹配到的元素，如未匹配到返回null
(2)document.querySelectorAll("selector"); 选择器返回所有匹配到的元素，如未匹配到返回空数组
(3) document.getElementsByClassName("name"); 选择器返回所有匹配到的元素，如未匹配到返回空数组
支持： Chrome, FireFox, Safari, Opera, IE 8+
3.classList对象
在HTML5 API里，页面DOM里的每个节点上都有一个classList对象，程序员可以使用里面的方法新增、删除、修改及判断节点上的CSS类。
classList对象里有些很有用的方法：
length: 类名个数
item(index): 获取类名
add(): 添加类
remove(): 删除类
contains(): 判断类
toggle(): 反转类//有就删除，没有就添加
4.cookie
document.cookie="user1=YY";
（1）设置cookie
function setCookie(key,Val,Days){
var dates=new Date();
dates.setDate(dates.getDate()+Days);
document.cookie=key+'='+escape(Val)+'; expires='+dates;
}
获取cookie
function getCookie(key){
var cookies=document.cookie;//返回："user1=YY; user2=MM"
var arr1=cookies.split('; ');
for (var i = 0; i < arr1.length; i++) {
var arr2=arr1[i].split('=');
if (arr2[0]==key) {
return unescape(arr2[1]);//解码
};
};
return false;
}
function rmCookie(key){//删除cookie
setCookie(key,'a',-3);
}
用escape( )函数进行编码，它能将一些特殊符号使用十六进制表示，从而可以存储于cookie值中 当使用escape( )编码后，在取出值以后需要使用unescape( )进行解码才能得到原来的cookie值。
5.ajax
1.是什么？
AJAX = Asynchronous JavaScript And XML （ AJAX = 异步 JavaScript 和 XML）
AJAX 是一种在无需重新加载整个网页的情况下，能够更新部分网页的技术
通俗的讲，AJAX就是JS通过一个网址去加载数据，这个过程通常是用户不可见的
传统的网页（不使用 AJAX）如果需要更新内容，必需重新加载整个网页
2.优势
异步加载数据，无需切换页面
更佳的用户体验：局部刷新、及时验证、操作步骤简化等
节省流量
JS控制数据的加载，更加灵活多用
3.send（）
post请求需在send之前设置：
xhr.setRequestHeader("Content-type","application/x-www-form-urlencoded");
4.JSON转换方法
在数据传输流程中，json是以文本即字符串的形式传递的，而JS操作的是JSON对象，所以，JSON对象和JSON字符串之间的相互转换是关键
（1）由JSON字符串转换为JSON对象
var str='{"name":"xiaoming","age":"21"}';
var obj=eval('('+str+')');
var obj1=JSON.parse(str);
(2) 将JSON对象转化为JSON字符串
var str1=JSON.stringify(obj1);
5.ajax
xhr.open('get','test05.php?_='+new Date().getTime(),true); //生成不一样的url解决缓存问题
xhr.open('get','test05.php?age='+ipt.value+'&_='+new Date().getTime(),true);
6.iframe标签
iframe元素会创建包含另外一个文档的内联框架
常用属性：
frameborder属性规定是否显示框架周围的边框 值：0/1
src属性规定要显示的文档的URL 可是：html、文本、ASP等
scrolling属性规定是否显示滚动条 值：yes no auto
<iframe frameborder=“0” src=“abc.html” scrolling=“auto”></iframe>
7.跨域
跨域可以简单的理解为从一个域名访问另一个域名，出于安全考虑，浏览器不允许这么做。
img、script、iframe等元素的src属性可以直接跨域请求资源
ajax跨域
ajax本身并不能跨域！
实现跨越的方式：
1.可以让服务器去别的网站获取内容然后返回页面
2.给页面的ajax一个url，ajax把这个url传给服务器，由服务器去访问跨域地址
jsonp跨域
jsonp就是利用script标签的跨域能力请求资源 既然叫jsonp，显然目的还是json，而且是跨域获取
利用js创建一个script标签，把json的url赋给script的scr属性，把这个script插入到dom里，
让浏览器去获取 最终获得一个类似这样的数据：
callback({"name":"Jack","from":"加勒比海"});
callback是页面存在的回调方法，参数就是想得到的json 回调方法要遵从服务端的约定一般是用 callback 或者 cb
用jsonp做百度搜索
<script>
var list=document.getElementById('list');
var ipt=document.getElementById('ipt');
var Script=null;
ipt.onkeyup=function(){
if (Script) {
document.body.removeChild(Script);
};
Script=document.createElement('script');
Script.src='http://suggestion.baidu.com/su?wd='+ipt.value+'&cb=mycallback&t='+new Date().getTime();
document.body.appendChild(Script);
}
function mycallback(json){
list.innerHTML='';
for (var i = 0; i < json.s.length; i++) {
list.innerHTML+='<li>'+json.s[i]+'</li>';
}
}
</script>