1.cookie与storage 的区别
(1)出现时间:
coookie:有JS的时候就有了
storage:有H5以后才有的
(2)存储大小:
cookie:4KB
storage:20MB
(3)前后端交互:
cookie:交互时请求默认携带cookie
storage:交互式请求不会携带,除非前端人员配置传递
(4)前后端操作:
cookie:不管前后端语言都可以操作
storage:只能有前端语言来操作
(5)过期时间:
cookie:默认会话级,页面关闭,存储消失,可以通过手动配置
storage:不能通过手动配置
localStorage 与 sessionStorage 的区别?
过期时间:
localStorage:永久存储,除非手动清理
sessionStorage:会话级别,关闭页面,存储就失效
2.获取常规与非常规 DOM 的方法
3.1获取常规DOM方法:
3.1.1通过类名获取标签:
document.getElementsByClassName(' ')
3.1.2通过标签名获取标签:
document.getElementsByTagName(' ')
3.1.3通过id名获取标签:
document.getElementById(' ')
3.2获取非常规DOM(html head body)
3.2.1获取html语法:document.documentElement
3.2.2获取head语法:document.head
3.2.3获取body语法:document.body
3.3按照选择器的形式获取标签满足条件的第一个
document.querySelector(' ')
按照选择器的形式获取标签满足条件的全部
document.querySelectorAll(' ')
3.获取设置移出元素属性的方法(getAttribute, setAttribute, removeAttribute)
4.1获取元素的某些属性:
元素.getAttribute('要查询的属性名')
4.2设置元素的某些属性:
元素.setAttribute('要设置的属性名','要设置的属性值')
4.3移出元素的某个属性:
元素.removeAttribute('要移除的属性名')
4.H5 自定义属性的获取设置与删除
5.1获取语法:元素.dataset.属性名
5.2设置语法:元素.dataset.属性名=' '
如果属性名存在做的是修改操作;如果属性名不存在做的是新增操作;
5.3删除语法:delete 元素.dataset.属性名
5.innerHTML 与 innerText
innerHTML
获取到标签内部的文本与 HTML 结构;赋值时会识别字符串中html结构
innerText
只会获取到 页面结构的文本内容, HTML结构会被忽略掉;赋值时不会识别字符串中html结构