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')
})

 感謝蕭大!