一些面试题

行内元素 块级元素

CSS规定每个元素都有display属性
行内元素 a b span img input select strong
块级元素 div ul ol li dl dt dd h1 -h6 p

页面导入样式时使用link和@import有什么区别

1.link属于xhtml标签，除了加载css外还能用于定义rel连接属性等作用，而@import是css提供的只能用于加载css
2.页面被加载时，link会同时被加载@import引用的css会到页面被加载完再加载

渲染引擎 JS引擎

负责取得网页的内容整理讯息以及计算网页的显示方式，然后会输出至显示器或打印机，浏览器的内核不同对于网页的语法解释会有不同所以渲染的效果也不同
解析和执行js来实现网页的动态效果
内核倾向于只0值渲染引擎

常见的浏览器内核

Trident内核IE MaxThon TT The World
Gecko内核FF NetScape6及以上
Presto内核Opera7及以上
Webkit内核Safari Chrome

iframe有哪些缺点

iframe会阻塞主页面的onload事件
搜索引擎的检索程序无法解读这种页面，不利于SEO
iframe和主页面共享连接池 而浏览器对相同域的连接有限制所以会影响页面的并行加载
如果需要使用iframe最好是通过js动态给iframe添加src属性

label的作用怎么用

label标签来定义表单控制间的关系，当用户选择该标签时，浏览器会自动将焦点转到和标签相关的表单控制上
label中的for属性和表单控件的id相同进行关联 或label包裹表单控件

HTML的form如何关闭自动完成功能

给不想要提示的form或某个input设置为 autocomplete=off

页面可见性（Page Visibility API)可以有哪些用途

通过visibility state的值检测页面当前是否可见，以及打开网页的时间等；在页面被切换到其他后台进程的时候，自动暂停音乐或视频

title与h1 b与strong i与em的区别

title属性没有明确意义只表示是个标题 h1则表示层次明确的标题
strong是标明重点内容 有语气加强的含义使用阅读设备时会重读而且展示强调内容
i内容上展示斜体 em有强调的含义

盒模型

标准盒模型 内容 内边距 外边距 边框
ie盒模型 内容部分把边框和内边距计算了进去

css选择器

id选择器 类选择器 标签选择器 相邻选择器 子选择器 后代选择器 通配符选择器 属性选择器 伪类选择器

可继承的属性

font-size color font-family （不可继承的样式 border padding margin width height)

display的值有哪些

block none
inline-block 像行内元素一样显示但其内容像块元素一样显示
list-item 像块元素一样显示 并添加样式列表标记
table 此元素会作为块级表格来显示
inherit规定应该从父元素继承display 属性的值

position的值

absolute 相对于static定位以外的第一个父元素进行定位
relative 相对于其正常位置进行定位
fixed 相对于浏览器窗口进行定位
static 默认值
inherit 从父元素继承position的值

为什么要初始化css样式

浏览器的兼容问题，不同浏览器对有些标签的默认值是不同的 不初始化会出现浏览器之间的页面显示差异

CSS里的visibility属性有个collapse属性值是干嘛用的

当在表格元素中使用时，此值可删除一行或一列，但是它不会影响表格的布局。被行或列占据的空间会留给其他内容使用。如果此值被用在其他的元素上，会呈现为 “hidden”。

css预处理器

less sass stylus 增强css代码的复用性
后处理器
postcss 给css属性添加浏览器私有前缀实现跨浏览器兼容性的问题

兼容性 常用的hack技巧

png24位的图片在ie6浏览器上出现背景 解决方案是做成png8
浏览器默认的margin padding

*{	margin ：0；
	padding：0
	}

ie下可以使用获取常规属性的方法来获取自定义属性 ，也可以使用getAttribute()获取自定义属性
FireFox下只能使用getAttribute（）获取自定义属性 统一通过getAttribute（）获取自定义属性
chorme会默认将小于12px的文本强制按照12px显示 可以通过加入css属性
-webkit-text-size-adjust：none解决
设置超链接的样式顺序 LVHA 超链接访问过后hover样式就不出现了被点击访问过的样式 不再聚友hover和active

js

数据封装类对象 object Array Boolean Number String
其他对象 Function Arguments Math Date RegExp Error

javascript基本规范

不要在同一行声明多个变量
请使用===/！==来比较true/false或者数值
使用对象字面量代替new Array这种形式
不要使用全局函数
switch语句必须带有default分支
函数不应该有时候有返回值 有时候没有返回值
for 循环必须使用大括号
if语句必须使用大括号
for-in循环中的变量 应该使用var 关键字明确限定作用域 从而避免作用域污染

javascript有几种类型的值

栈 原始数据类型 undefined null boolean number string symbol
堆 引用数据类型 对象 数组 函数
大小固定频繁使用放入栈中存储 原始数据类型
大小不固定 引用数据类型在栈中存储了指针 ，该指针指向堆中该实体的起始地址 当解释器寻找引用值时会首先检索其在栈中地址取得地址后从堆中获得实体

js中如何实现继承

构造继承 原型继承 实例继承 拷贝继承

js作用域链

全局函数无法查看局部函数的内部细节 但是局部函数可以查看其上层函数细节 直至全局细节
当需要从局部函数查找某一属性或方法时，如果当前作用域没有找到 就会上溯到上层作用域查找 直至全局函数 这种组织形式就是作用域链

this的指向

this总是指向函数的直接调用者
如果有new 关键字this指向new出来的那个对象
在事件中this指向触发这个事件的对象
ie中的attachEvent中的this总是指向全局对象window
当用apply和call上下文调用的时候this指向传入的第一个参数

如何判断一个对象是否属于某个类

instance of

回流 重绘

如果渲染树的节点发生了结构性变化，例如 宽度高度或者位置上的变化那么会触发 reflow 的逻辑
如果渲染树节点发生了非结构性变化 例如背景等的变化 那么会触发repaint的逻辑

new 操作符具体干了什么

1.创建一个空对象 并且this变量引用该对象 同时还继承了该函数的原型
2.属性和方法被加入到this引用的对象中
3.新创建的对象由this所引用 并且最后隐式的返回this

异步加载的方式有哪些

defer （加载完后才执行） 只支持ie async （加载和执行并行进行）

描述一下cookies sessionStorage 和localStorage的区别

cookie数据始终在同源的http请求中携带 会在浏览器和服务器之间来回传递
sessionStorage和localStorage不会自动把数据发给服务器仅在本地保存
存储大小 cookie 不大于4k Storage5M或者更多
cookie设置过期时间 session浏览器关闭数据删除 local存储持久数据 除非主动删除

闭包的注意点

1.由于闭包会使得函数中的变量都被保存在内存中，内存消耗很大，所以不能滥用闭包，否则会造成网页的性能问题 在ie中可能导致内存泄漏 解决方法是在 退出函数之前将不使用的局部变量全部删除
2.闭包会在父函数外部 改变父函数内部变量的值 所以 如果你把父函数当作对象使用 把闭包当作它的公用方法 把内部变量当作他的私有属性 这时一定要小心 不要随便改变父函数内部变量的值