欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

js小结

程序员文章站 2022-06-30 12:10:03
1.JSON 与 JS 对象的关系 JSON 是 JS 对象的字符串表示法,它使用文本表示一个 JS 对象的信息,本质是一个字符串。 如var obj = {a: 'Hello', b: 'World'}; //这是一个对象,注意键名也是可以使用引号包裹的 var json = '{"a": "He ......

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

 感谢萧大!