新选择器、classList和访问历史记录

javascript:

基础API提升

一、新选择器

1.document.querySelector(selector);

    返回第一个满足选择器条件的元素(返回一个dom对象)

2.document.querySelectorAll('.item');

    返回所有满足该条件的元素(返回一个元素类型是dom类型的数组)

3.$('.item')

    返回一个jQuery对象(返回dom元素的数组)

4.本质上jquery方式和qs方式都是获取DOM数组,只不过jquery会多一些其他成员

5.DOM数组的每一个成语注册事件不能像jquery一样直接注册,必须分别给每个元素注册

6.h5就是将我们经常需要的操作又包装一层

二、Element.classList

1.新H5中DOM对象多了一个classList属性,是一个数组

2.add   添加一个新的类名

3.remove   删除一个新的类名

4.contains   判断是否包含一个指定的类名

5.toggle   切换一个class  element.toggle('class-name',[add_or_remove]);

6.toggle    函数的第二个 参数true为添加  false为删除

三、访问历史

界面上的所有JS操作不会被浏览器记住,就无法回到之前的状态

在HTML5中可以通过window.history操作访问历史状态,让一个页面可以有多个历史

1.window.history.forward();  //前进

2.window.history.back();  //后退

3.window.history.go();  //刷新

4.通过JS可以加入一个访问状态

5.history.pushState(放入历史中的状态数据,设置title(现在浏览器不支持))

四、Web Storage

1.localStorage   永久存储的

2.sessionStorage   浏览器打开时存储的,关闭时便没有了

3.getItem方式获取一个不存在的键,返回空字符串

4.[]返回 undefined

 

posted on 2016-09-24 15:54  嗨_ck  阅读(141)  评论(0编辑  收藏  举报

导航