1、link和@import的区别
答:页面中使用CSS的方式主要有3种:行内添加定义style属性值,页面头部内嵌调用和外面链接调用,其中外面引用有两种:link和@import。外部引用CSS两种方式link和@import的方式分别是:
link方式:
<link rel="stylesheet" rev="stylesheet" href="CSS文件" type="text/css" media="all" />
@import方式:
<style type="text/css" media="screen">
@import url("CSS文件");
</style>
两者都是外部引用CSS的方式,但是存在一定的区别:
区别1:link是XHTML标签,除了加载CSS外,还可以定义RSS等其他事务;@import属于CSS范畴,只能加载CSS。
区别2:link引用CSS时,在页面载入时同时加载;@import需要页面网页完全载入以后加载。
区别3:link是XHTML标签,无兼容问题;@import是在CSS2.1提出的,IE5以上才识别。
区别4:link支持使用Javascript控制DOM去改变样式;而@import不支持。当使用javascript控制dom去改变样式的时候,只能使用link标签,因为@import不是dom可以控制的。
link权重大于import
@import建议书写方式
@import url(style.css) 和@import url("style.css")
2、行内元素、块级元素、空元素分别都有哪些?
答:
行内元素:a、abbr、audio、acronym、b、bdo、big、br、cite、code、em、i、img、input、kbd、label、q、select、small、span、strong、sub、sup、textarea、tt、var
块级元素:address、【table、caption、thead、tbody、tfood、th、tr、td】、【ol、ul、li】、【dl、dt、dd】、【fieldset、legend、noframes】、form、h1-6、hr、noscript、p、pre
可变元素:button、del、iframe、ins、map、object、script
空元素:br、hr、link、meta、input、img
3、介绍一下盒子模型
答:分为两种,一种是IE盒子模型,它的content
包括了padding
和border
;另一种是标准盒子模型。
盒子模型:content
、padding
、border
、margin
4、如何居中一个div?
答:
margin: 0 auto;
5、如何居中一个浮动元素?
答:
position: absolute;
left: 50%;
margin-left: 元素的width的一半;
或者
position: relative;
margin-left: 50%;
left: 元素的width的一半;
6、介绍一下js的基本数据类型
答:
基本类型: Number、String、Boolean、Object、Null、Undefined
typeof: number、string、boolean、Object、Object、undefined
引用类型Array、Function、Object、RegEp
,其中Function
的实例typeof值为function;
基本的包装类型Number、String、Boolean
7、js中如何实现继承
答:
1、原型链继承
2、借用构造函数继承。在子构造函数调用父构造函数。
3、组合继承(原型链继承+借用构造函数继承)
4、原型继承
5、寄生继承
8、jQuery中如何将数组转为json字符串,然后再转化回来?
答:
转为json: array.serializeArray();
转为数组:JSON.parse(json);//jQuery本身没有转换回来的方法,这里调用浏览器的JSON.parse方法
9、如何判断脚本运行在浏览器还是node环境中?
答:通过判断Global对象是否为window,如果不为window,当前脚本没有运行在浏览器中
10、如何管理项目?
答:
11、一个页面从输入url到页面加载完成,这个过程都发生了什么?
答:
分为4个步骤:
(1),当发送一个URL请求时,不管这个URL是Web页面的URL还是Web页面上每个资源的URL,浏览器都会开启一个线程来处理这个请求,同时在远程DNS服务器上启动一个DNS查询。这能使浏览器获得请求对应的IP地址。
(2), 浏览器与远程Web服务器通过TCP三次握手协商来建立一个TCP/IP连接。该握手包括一个同步报文,一个同步-应答报文和一个应答报文,这三个报文在 浏览器和服务器之间传递。该握手首先由客户端尝试建立起通信,而后服务器应答并接受客户端的请求,最后由客户端发出该请求已经被接受的报文。
(3),一旦TCP/IP连接建立,浏览器会通过该连接向远程服务器发送HTTP的GET请求。远程服务器找到资源并使用HTTP响应返回该资源,值为200的HTTP响应状态表示一个正确的响应。
(4),此时,Web服务器提供资源服务,客户端开始下载资源。
请求返回后,便进入了我们关注的前端模块
简单来说,浏览器会解析HTML生成DOM Tree,其次会根据CSS生成CSS Rule Tree,而javascript又可以根据DOM API操作DOM
12、http状态码有哪些?分别代表什么意思?
答:
一、200状态码:
成功2××: 成功处理了请求的状态码。
1、200 :服务器已成功处理了请求并提供了请求的网页。
2、204: 服务器成功处理了请求,但没有返回任何内容。
二、300状态码:
重定向3×× :每次请求中使用重定向不要超过 5 次。
1、301: 请求的网页已永久移动到新位置。当URLs发生变化时,使用301代码。搜索引擎索引中保存新的URL。
2、302: 请求的网页临时移动到新位置。搜索引擎索引中保存原来的URL。
3、304: 如果网页自请求者上次请求后没有更新,则用304代码告诉搜索引擎机器人,可节省带宽和开销。
三、400状态码:
客户端错误4×× :表示请求可能出错,妨碍了服务器的处理。
1、400: 语法有误,服务器不理解请求的语法。
2、403: 服务器拒绝请求。
3、404: 服务器找不到请求的网页。服务器上不存在的网页经常会返回此代码。
4、410 :请求的资源永久删除后,服务器返回此响应。该代码与 404(未找到)代码相似,但在资源以前存在而现在不存在的情况下,有时用来替代404 代码。如果资源已永久删除,应当使用 301 指定资源的新位置。
四、500状态码:
服务器错误5×× :表示服务器在处理请求时发生内部错误。这些错误可能是服务器本身的错误,而不是请求出错。
1、500 :服务器遇到错误,无法完成请求。
2、503: 服务器目前无法使用(由于超载或停机维护)。
通常,这只是暂时状态。 希望大家在分析日志的时候可以参照一下,根据具体的状态码解决问题。
13、针对jQuery的优化方法
答:
1、减少DOM操作
2、适当使用原生js
3、用对选择器
4、缓存jQuery对象
5、定义一个可以复用的函数
6、使用链式写法
7、事件的委托处理
8、尽量少生成jQuery对象
14、如果需要手动写动画,你认为最小时间间隔是多久,为什么?
答:多数显示器默认频率是60Hz,即1秒刷新60次,所以理论上最小间隔为1/60*1000ms = 16.7ms