4.8-- HTML5 新方法： 选择器 ，获取class列表属性，JSON，data自定义数据
1，新的选择器
querySelector
querySelectorAll
getElementsByClassName
1，var oDiv = document.querySelector('.box'); //只能选择一组中的第一个元素 //alert( oDiv.length );
2，var aDiv = document.querySelectorAll('.box'); //获取一组元素 alert( aDiv.length );
3，var aDiv = document.getElementsByClassName('box');
alert( aDiv.length );
HTML5新特性的浏览器支持情况
http://www.caniuse.com/#index
2，获取class列表属性
classList
length : class的长度
add() : 添加class方法
remove() : 删除class方法
toggle() : 切换class方法
toggle() : 切换class方法 如果这个元素在数组中出现，则删除，如果这个元素在数据中没有，则添加。
window.onload = function(){
var oDiv = document.getElementById('div1');
//alert( oDiv.classList ); //类似与数组的对象
//alert( oDiv.classList.length ); //3
//oDiv.classList.add('box4');
//oDiv.classList.remove('box2');
oDiv.classList.toggle('box2');
};
</script>
</head>
<body>
<div id="div1" class="box1 box2 box3">div</div>
3，JSON 新方法
浅拷贝，深拷贝， parse， eval 区别，
《妙味：对象的引用》 视频详细介绍 对象的引用， 浅拷贝，深拷贝
parse() : 把字符串转成json
字符串中的属性要严格的加上引号
stringify() : 把json转化成字符串
会自动的把双引号加上
新方法与eval的区别：
eval: 可以解析任何字符串变成 js
parse： 只能解析 json 形式的字符串变成 js （安全性高）
新方法的应用
深度克隆新对象
/*var a = { name : 'hello' }; var b = a; b.name = 'hi'; alert( a.name );*/ 由于对象的引用，a.name值改变为 b的值。
采用for 语句进行赋值可以解决此问题：
/*var a = { name : 'hello' }; var b = {}; for(var attr in a){ b[attr] = a[attr]; } b.name = 'hi'; alert( a.name );*/
//视频 : 对象的引用
var a = { name : { age : 100 } }; var str = JSON.stringify(a); var b = JSON.parse(str); b.name.age = 200; alert( a.name.age );
如何其他浏览器做到兼容
http://www.json.org/去下载json2.js
HTML5新特性的浏览器支持情况
http://www.caniuse.com/#index
4，data自定义数据
dataset
data-name : dataset.name
data-name-first : dataset.nameFirst
Data数据在jquery mobile中有着重要作用
延迟加载JS
JS的加载会影响后面的内容加载
很多浏览器都采用了并行加载JS，但还是会影响其他内容
Html5的defer和async
defer : 延迟加载，会按顺序执行，在onload执行前被触发
async : 异步加载，加载完就触发，有顺序问题
Labjs库
