HTML 5 新增方法以及历史管理

@(HTML5)[HTML5 新增方法]

[TOC]

十四、 HTML 5 新增方法以及历史管理

新增的获取元素的方法

静态获取的方法:

  • document.querySelector() 选择单个元素
  • document.querySelectorAll() 选择一组元素
    动态获取的方法:
  • document.getElementsByClassName() 通过类名选择
    // 通过 getELementBy 的方法是动态获取的 HTMLCollection
    // 通过 querySelector 的方法获取的是静态的 NodeList

classList

  • length : class的长度
  • add() : 添加class方法
  • remove() : 删除class方法
  • toggle() : 切换class方法
  • contains() : 判断类名是否存在返回bool值

JSON

  • parse() : 把字符串转成json
    字符串中的属性要严格的加上引号
  • stringify() : 把json转化成字符串
    会自动的把双引号加上

与eval的区别
eval():对任何的字符串进行解析变成js
parse():字符串中的属性要严格的加上引号

其他浏览器兼容:下载json2.js

历史管理

onhashchange :改变hash值来管理

history :历史管理
服务器下运行
pushState : 三个参数 :数据 标题 地址(可选)
replaceState: 替换
pushState()可以创建历史,可以配合popstate事件,而replaceState()则是替换掉当前的URL,不会产生历史。
onpopstate事件 : 读取数据 event.state

history:

  • back() 相当浏览器的后退按钮
  • go() 参数 0当前索引值 1下一页 -1上一页
  • forward( ) 相当浏览器的前进按钮
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容