前端js 基础面试题目(提前看)

因为前些天面试一大公司的时候没看基础题,翻车了

行内元素和块元素分别有哪些

块级元素：div  , p  , form,   ul,  li ,  ol, dl,    form,   address, fieldset,  hr, menu,  table
行内元素：span,   strong,   em,  br,  img ,  input,  label,  select,  textarea, cite

块级元素的前后都会自动换行，如同存在换行符一样，默认情况下，块级元素会独占一行

行内元素可以与其他行内元素位于同一行，在浏览器中显示时不会换行，对其不能设置高度和宽度。

iframe有那些缺点？

1.frame会阻塞主页面的Onload事件；

2.iframe和主页面共享连接池，而浏览器对相同域的连接有限制，所以会影响页面的并行加载。

3.SEO不利，对爬虫不友好。

CSS的优先级？内联和important哪个优先级高？

!important > 行内样式（比重1000）> ID 选择器（比重100） > 类选择器（比重10） > 标签（比重1） > 通配符 > 继承 > 浏览器默认属性

浮动元素清除浮动方法

1、使用空标签清除浮动

2、使用overflow属性。（overflow:auto；zoom:1″用于兼容IE6）

3、使用after伪对象清除浮动。 该方法只适用于非IE浏览器

4、浮动外部元素，float-in-float。这种方法很简单，就是把“#outer”元素也进行浮动（向左或者向右）。

闭包的理解，javascript的作用域

a、闭包就是能够读取其他函数内部变量的函数。

b、在本质上，闭包就是将函数内部和函数外部连接起来的一座桥梁。

闭包的用途

闭包可以用在许多地方。它的最大用处有两个，一个是前面提到的可以读取函数内部的变量，另

一个就是让这些变量的值始终保持在内存中。

实例如下：

根据作用域链的规则，底层作用域没有声明的变量，会向上一级找，找到就返回，没找到就一

直找，直到window的变量，没有就返回undefined。这里明显count 是函数内部的flag2 的那

个count 。

var count=10;   //全局作用域 标记为flag1
function add(){
var count=0;    //函数全局作用域 标记为flag2
return function(){
    count+=1;   //函数的内部作用域
    alert(count);
}
}
var s = add()
s();//输出1
s();//输出2

JS中作用域的概念：

表示变量或函数起作用的区域，指代了它们在什么样的上下文中执行，亦即上下

执行环境。Javascript的作用域只有两种：全局作用域和本地作用域，本地作用

是按照函数来区分的。

网站性能优化的方法

1、html语义化

2、减少重复代码，压缩css，js代码大小

3、背景图片大小及数量

4、减少http请求，合理设置缓存

5、图片懒加载

6、减少cookie传输

7、js中减少DOM操作，避免使用eval和 Function，减少作用域链查找

8、CDN加速

9、反向代理

9.1 传统代理服务器位于浏览器一侧，代理浏览器将http请求发送到互联网上，而反向代理服务器位于网站机房一侧，代理网站web服务器接收http请求。

9.2 反向代理也可以实现负载均衡的功能，而通过负载均衡构建的应用集群可以提高系统总体处理能力，进而改善网站高并发情况下的性能。

请描述一下 cookies，sessionStorage 和 localStorage 的区别

cookie是网站为了标示用户身份而储存在用户本地终端（Client Side）上的数据（通常经过加密）。

cookie数据始终在同源的http请求中携带（即使不需要），记会在浏览器和服务器间来回传递。

sessionStorage和localStorage不会自动把数据发给服务器，仅在本地保存。

存储大小： cookie数据大小不能超过4k。 sessionStorage和localStorage 虽然也有存储大小的限制，但比cookie大得多，可以达到5M或更大。

有期时间： localStorage 存储持久数据，浏览器关闭后数据不丢失除非主动删除数据； sessionStorage 数据在当前浏览器窗口关闭后自动删除。 cookie 设置的cookie过期时间之前一直有效，即使窗口或浏览器关闭。

介绍一下CSS的盒子模型？

有两种， IE 盒子模型、标准 W3C 盒子模型；IE的content部分包含了 border 和 pading;

盒模型： 内容(content)、填充(padding)、边界(margin)、 边框(border).

box-sizing的作用就是告诉浏览器，使用的盒模型是W3C盒模型，还是IE盒模型。

当 box-sizing 的值为content-box指定盒子模型为W3C (表示width = content)，border-box为IE盒子模型 (width = padding + border + content)。

到此这篇关于前端js 基础面试题目(提前看)的文章就介绍到这了,更多相关js 基础面试内容请搜索脚本之家以前的文章或继续浏览下面的相关文章，希望大家以后多多支持脚本之家！