js的BOM对象和DOM对象
（9）序列化
var d = {'a':'aa','b':18};
序列化:
var d_json = JSON.stringify(d); //python json.dumps(d);
反序列化:
d_json = "{"a":"aa","b":18}"
var reverse_json = JSON.parse(d_json); //python json.loads()
5、BOM对象
浏览器对象模型，描述与浏览器进行交互的方法和接口
（1）弹窗
alert();和confirm();
（2）window对象，全局BOM对象，是后面学的所有对象的原始对象
（3）location对象
location.href; 获取当前页面的地址
location.href = 'http://www.baidu.com'; 跳转到这个网址上
location.reload(); 刷新当前页面
（4）计时器
第一种:一段时间之后执行某个任务
设置:var t = setTimeout(function(){confirm('你满18岁了吗?')},5000);
var t = setTimeout("console.log('xxx')",1000);
t就是浏览器用来记录你的计时器的标识数字
清除:clearTimeout(t)
第二种:每隔一段时间执行某个任务
设置:var t = setInterval(function(){confirm('弹个框!!')},3000);
清除:clearInterval(t);
6、DOM对象
描述处理网页内容的方法和接口
（1）直接查 找选择器
按标签名查找: var divEle = document.getElementsByTagName(‘div’);
按id值查找: var d1 = document.getElementById(‘d1’);
按类值查找:var a = document.getElementsByClassName(‘c1’);
html代码:
css代码:
.c1{
background-color: green;
height: 100px;
width: 100px;
}
.c2{
background-color: red;
/*height: 100px;*/
/*width: 100px;*/
color:red;
}
var d2 = document.getElementsByClassName('c1');
d2.style.color = 'green';
报错：因为得到的是多个标签对象，会放到一个数组里面，也就是得到的d2是个标签数组对象，里面比普通数组多了一些其他的属性
VM1527:1 Uncaught TypeError: Cannot set property 'color' of undefined
at :1:16
所以需要循环来设置标签效果
for (var i in d2){console.log(d2[i])}; 直接循环数组不好，因为有其他属性干扰
VM1658:1 div1
VM1658:1 div2
VM1658:1 2
VM1658:1 ƒ item() { [native code] }
VM1658:1 ƒ namedItem() { [native code] }
需要下面的方式进行循环
for (var i=0;i （2）间接查找选择器：
.nextElementSibling.style.color = 'red'; 找下一个兄弟标签,并改了色
找上一个兄弟：.previousElementSibling;
找第一个儿子：.firstElementChild;
找最后一个儿子：.lastElementChild;
找所有儿子,是一个数组：.children;
找到自己的父级标签：.parentElement;
（3）文本操作
innerText
获取文本:
var a = document.getElementById('jd')
a.innerText; 只获取文本内容
设置文本:
a.innerText = '校花';不能识别标签,单纯的文本内容显示
innerHTML
获取文本
var d = document.getElementsByClassName('c1')[0];
d.innerHTML; 获取的内容包含标签
设置文本:
d2.innerHTML = '校花'; 能够识别标签,生成标签效果
（4）value值操作
input标签
html:
示例:
var inp = document.getElementById('username'); 找到标签
inp.value; 获取值
inp.value = '200块!'; 修改值
（5）class类值操作
var div1 = document.getElementById('d1');
div1.classList; // 获取标签类值
div1.classList.add('c2'); // 添加类值
div1.classList.remove('c3'); // 删除类值
div1.classList.toggle('c3'); // 有就删除,没有就添加
var t = setInterval("div1.classList.toggle('c3')",1000); //定时器添加
（6）style样式
var div1 = document.getElementById('d1');
div1.style.color = 'green';
//当css属性名称有-的时候，需要去掉-，并且后面单词的首字母大写
div1.style.backgroundColor = 'green';
（7）label补充和button补充
label：id和name可以重复，可以内部使用input标签
button：
普通按钮,没有提交效果
下面两个能够提交form表单数据
示例：
（8）日期对象
var timer = new Date(); //获取当前时间日期对象
timer.toLocaleString(); // 将日期时间对象转换为国人能够认识的时间日期字符串
下面的内容，目前作为了解：
//方法1：不指定参数
var d1 = new Date(); //获取当前时间
console.log(d1.toLocaleString()); //当前时间日期的字符串表示
//方法2：参数为日期字符串
var d2 = new Date("2004/3/20 11:12");
console.log(d2.toLocaleString());
var d3 = new Date("04/03/20 11:12"); #月/日/年(可以写成04/03/2020)
console.log(d3.toLocaleString());
//方法3：参数为毫秒数，了解一下就行
var d3 = new Date(5000);
console.log(d3.toLocaleString());
console.log(d3.toUTCString());
//方法4：参数为年月日小时分钟秒毫秒
var d4 = new Date(2004,2,20,11,12,0,300);
console.log(d4.toLocaleString()); //毫秒并不直接显示
常用方法
var d = new Date();
//getDate() 获取日
//getDay () 获取星期 ，数字表示（0-6），周日数字是0
//getMonth () 获取月（0-11,0表示1月,依次类推）
//getFullYear () 获取完整年份
//getHours () 获取小时
//getMinutes () 获取分钟
//getSeconds () 获取秒
//getMilliseconds () 获取毫秒
//getTime () 返回累计毫秒数(从1970/1/1午夜),时间戳
（9）事件
DOM中可以为标签设置事件，给指定标签绑定事件之后，只要对应事件被触发，就会执行对应代码。
常见事件
-
onclick，单击时触发事件 -
ondblclick，双击触发事件 -
onchange，内容修改时触发事件 -
onfocus，获取焦点时触发事件 -
onblur，失去焦点触发事件修改下拉框触发change事件DOM学习
（10）事件绑定
事件绑定的两种方式
方式1
赞
function doFavor(self) {
...
}
方式2
赞
var dEle = document.getElementsByClassName('favor')
dEle.onclick = function(){
...
}