js小结

1.JSON 与 JS 对象的关系

JSON 是 JS 对象的字符串表示法，它使用文本表示一个 JS 对象的信息，本质是一个字符串。
如var obj = {a: 'Hello', b: 'World'}; //这是一个对象，注意键名也是可以使用引号包裹的

var json = '{"a": "Hello", "b": "World"}'; //这是一个 JSON 字符串，本质是一个字符串
JSON 和 JS 对象互转
要实现从对象转换为 JSON 字符串，使用 JSON.stringify() 方法：

var json = JSON.stringify({a: 'Hello', b: 'World'}); //结果是 '{"a": "Hello", "b": "World"}'
要实现从 JSON 转换为对象，使用 JSON.parse() 方法：

var obj = JSON.parse('{"a": "Hello", "b": "World"}'); //结果是 {a: 'Hello', b: 'World'}

 

2.element.insertAdjacentHTML(position, text);
position是相对于元素的位置，并且必须是以下字符串之一：

'beforebegin'
元素自身的前面。
'afterbegin'
插入元素内部的第一个子节点之前。
'beforeend'
插入元素内部的最后一个子节点之后。
'afterend'
元素自身的后面。
text是要被解析为HTML或XML,并插入到DOM树中的字符串

3.开关css属性

例如mask.classList.toggle('mask-active')

等同于

if(mask.classList.contains('mask-active'){
　　mask.classLIst.remove('mask-active')
}else{
　　mask.classLIst.add('mask-active')
}

4.

如不同的网页标签一样，点到那个就显现，其余的隐藏，时添加了css中display:non
知道选了谁用event.target,如div的隐藏，classList,把标签转换成数组形式
var a = document.querySelector('#id-a-click')
　　a.addEventListener('mouseover',function(){
var tip = document.querySelector('.tip')
　　tip.classList.remove('bai-hide')
})
a.addEventListener('mouseout',function(){
　　var tip = document.querySelector('.tip')
　　tip.classList.add('bai-hide')
})

 感谢萧大!