1、cookie和localstorage的区别
Web Storage
的概念和cookie
相似,区别是它是为了更大容量存储设计的。Cookie
的大小是受限的,并且每次你请求一个新的页面的时候Cookie
都会被发送过去,这样无形中浪费了带宽,另外cookie
还需要指定作用域,不可以跨域调用。
除此之外,Web Storage
拥有setItem,getItem,removeItem,clear
等方法,不像cookie
需要前端开发者自己封装setCookie,getCookie
。
但是Cookie
也是不可以或缺的:Cookie
的作用是与服务器进行交互,作为HTTP
规范的一部分而存在 ,而Web Storage
仅仅是为了在本地“存储”数据而生
浏览器的支持除了IE7
及以下不支持外,其他标准浏览器都完全支持(ie及FF需在web服务器里运行),值得一提的是IE总是办好事,例如IE7、IE6中的UserData
其实就是javascript
本地存储的解决方案。通过简单的代码封装可以统一到所有的浏览器都支持web storage
。
localStorage
和sessionStorage
都具有相同的操作方法,例如setItem、getItem
和removeItem
等
2、display:none 和visibility:hidden的区别
display:none 隐藏对应的元素,在文档布局中不再给它分配空间,它各边的元素会合拢,就当他从来不存在。
visibility:hidden 隐藏对应的元素,但是在文档布局中仍保留原来的空间。
3、
CSS中 link 和@import 的区别是?
(1) link属于HTML标签,而@import是CSS提供的; (2) 页面被加载的时,link会同时被加载,而@import引用的CSS会等到页面被加载完再加载;(3) import只在IE5以上才能识别,而link是HTML标签,无兼容问题; (4) link方式的样式的权重 高于@import的权重.
4、
1.id选择器( # myid)
2.类选择器(.myclassname)
3.标签选择器(div, h1, p)
4.相邻选择器(h1 + p)
5.子选择器(ul > li)
6.后代选择器(li a)
7.通配符选择器( * )
8.属性选择器(a[rel = "external"])
9.伪类选择器(a: hover, li:nth-child)
可继承的样式: font-size font-family color, text-indent;
不可继承的样式:border padding margin width height ;
优先级就近原则,同权重情况下样式定义最近者为准;
载入样式以最后载入的定位为准;
优先级为:
!important > id > class > tag
important 比 内联优先级高,但内联比 id 要高
CSS3新增伪类举例:
元素的每个 元素。p:first-of-type 选择属于其父元素的首个
元素的每个 元素。p:last-of-type 选择属于其父元素的最后
元素的每个 元素。p:only-of-type 选择属于其父元素唯一的
元素。p:only-child 选择属于其父元素的唯一子元素的每个
元素。p:nth-child(2) 选择属于其父元素的第二个子元素的每个
:enabled :disabled 控制表单控件的禁用状态。
:checked 单选框或复选框被选中。
:after :before (可以清除浮动,不改变文档结构)
5.清除浮动
1.使用空标签清除浮动。这种方法是在所有浮动标签后面添加一个空标签 定义css clear:both. 弊端就是增加了无意义标签。
2.使用overflow。
给包含浮动元素的父标签添加css属性 overflow:auto; zoom:1; zoom:1用于兼容IE6
3.使用after伪对象清除浮动。该方法只适用于非IE浏览器。具体写法可参照以下示例。使用中需注意以下几点。一、该方法中必须为需要清除浮动元素的伪对象中设置 height:0,否则该元素会比实际高出若干像素;
.clearfix:after{content: ".";display: block;height: 0;clear: both;visibility: hidden;}
6、html5有哪些新特性、移除了那些元素?如何处理HTML5新标签的浏览器兼容问题?如何区分 HTML 和 HTML5?
* HTML5 现在已经不是 SGML 的子集,主要是关于图像,位置,存储,多任务等功能的增加。
* 拖拽释放(Drag and drop) API
语义化更好的内容标签(header,nav,footer,aside,article,section)
音频、视频API(audio,video)
画布(Canvas) API
地理(Geolocation) API
本地离线存储 localStorage 长期存储数据,浏览器关闭后数据不丢失;
sessionStorage 的数据在浏览器关闭后自动删除
表单控件,calendar、date、time、email、url、search
新的技术webworker, websocket, Geolocation
* 移除的元素
纯表现的元素:basefont,big,center,font, s,strike,tt,u;
对可用性产生负面影响的元素:frame,frameset,noframes;
支持HTML5新标签:
* IE8/IE7/IE6支持通过document.createElement方法产生的标签,
可以利用这一特性让这些浏览器支持HTML5新标签,
浏览器支持新标签后,还需要添加标签默认的样式:
* 当然最好的方式是直接使用成熟的框架、使用最多的是html5shim框架
如何区分: DOCTYPE声明\新增的结构元素\功能元素
7、null和undefined
null
是一个表示"无"的对象,转为数值时为0;undefined
是一个表示"无"的原始值,转为数值时为NaN
。
当声明的变量还未被初始化时,变量的默认值为undefined
。null
用来表示尚未存在的对象,常用来表示函数企图返回一个不存在的对象。
undefined
表示"缺少值",就是此处应该有一个值,但是还没有定义。
(1)变量被声明了,但没有赋值时,就等于undefined。
(2) 调用函数时,应该提供的参数没有提供,该参数等于undefined。
(3)对象没有赋值的属性,该属性的值为undefined。
(4)函数没有返回值时,默认返回undefined。null
表示"没有对象",即该处不应该有值。典型用法是:
(1) 作为函数的参数,表示该函数的参数不是对象。
(2) 作为对象原型链的终点。