web面试题题库.docx

1、web面试题题库1、CSS选择符有哪些？1.id选择器（ # myid）2.类选择器（.myclassname）3.标签选择器（div, h1, p）4.相邻选择器（h1 + p）5.子选择器（ul li）6.后代选择器（li a）7.通配符选择器（ * ）8.属性选择器（arel = external）9.伪类选择器（a: hover, li: nth - child）2.display:none和visibility:hidden的区别是什么？visibility:hidden-将元素隐藏，但是还占着位置。display:none-将元素的显示设为无，不占任何的位置。3.如何优化网页加载速

2、度？1.减少css，js文件数量及大小(减少重复性代码，代码重复利用)，压缩CSS和Js代码2.图片的大小3.把css样式表放置顶部，把js放置页面底部4.减少http请求数5.使用外部 Js 和 CSS 4.jQuery和JavaScript相比的优缺点？优点：实现了脚本和页面的分离；最少的代码做最多的事（这也是jQuery的口号）；性能更好，几乎解决了所有的浏览器兼容问题；缺点：不能向后兼容；插件的兼容性（各版本之间不能很好的兼容），在同一个页面使用多个插件可能会出现冲突现象；稳定性方面也有待提高；5.form表单中input标签的readonly 和disabled属性有何区别？read

3、only=“readonly”是只读，不可以修改，disabled=“disabled”是禁用，整个文本框是显示灰色状态 form 中method是数据传递的方式，action是与后台数据库提交的6.行内元素和块级元素有什么区别？行内元素不可以设置宽高，不独占一行;块级元素可以设置宽高，独占一行。 7.js中的基本数据类型？1、数值类型：number 2、字符串类型：string 3、布尔类型：boolean（true和false）4、对象类型： abject （null）5、未定义类型： underfined（underfined）8.前端技术有哪些？还有哪些相关的书籍？JavaScript

4、jQueryHTML5CSS3（移动端框架：jQuerymobilePhonegapBootstra移动端开发工具等）精通JavaScript锋利的jQuery编写高质量代码：web前端开发修炼之道SEO教程：搜索引擎优化入门与进阶9.对前端界面工程师这个职位是怎么样理解的？它的前景会怎么样？前端是最贴近用户的程序员，比后端、数据库、产品经理、运营、安全都近。1、实现界面交互2、提升用户体验3、有了Node.js，前端可以实现服务端的一些事情前端是最贴近用户的程序员，前端的能力就是能让产品从90分进化到100分，甚至更好，参与项目，快速高质量完成实现效果图，精确到1px；与团队成员，UI设计，

5、产品经理的沟通；做好的页面结构，页面重构和用户体验；处理hack，兼容、写出优美的代码格式；针对服务器的优化、拥抱最新前端技术。10.前端页面有哪三层构成，分别是什么？作用是什么？网页分成三个层次，即：结构层、表示层、行为层。（1）网页的结构层（structurallayer）由HTML或XHTML之类的标记语言负责创建。标签，也就是那些出现在尖括号里的单词，对网页内容的语义含义做出这些标签不包含任何关于如何显示有关内容的信息。例如，P标签表达了这样一种语义：“这是一个文本段。”（2）网页的表示层（presentationlayer）由CSS负责创建。CSS对“如何显示有关内容”的问题做出了回

6、答。（3）网页的行为层（behaviorlayer）负责回答“内容应该如何对事件做出反应”这一问题。这是Javascript语言和DOM主宰的领域。11.怎样添加、移除、移动、复制、创建和查找节点（1）创建新节点 createDocumentFragment() /创建一个DOM片段 createElement_x() /创建一个具体的元素 createTextNode() /创建一个文本节点（2）添加、移除、替换、插入 appendChild() removeChild() replaceChild() insertBefore()（3）查找 getElementsByTagName() /

7、通过标签名称 getElementsByName() /通过元素的Name属性的值 getElementById() /通过元素Id，唯一性12.您最近看的一篇关于JavaScript的文章是什么答案不定，符合即可13.什么是盒子模型？在网页中，一个元素占有空间的大小由几个部分构成，其中包括元素的内容（content），元素的内边距（padding），元素的边框（border），元素的外边距（margin）四个部分。这四个部分占有的空间中，有的部分可以显示相应的内容，而有的部分只用来分隔相邻的区域或区域。4个部分一起构成了css中元素的盒模型。14.行内元素有哪些？块级元素有哪些？空(void

8、)元素有那些？行内元素：a、b、span、img、input、strong、select、label、em、button、textarea块级元素：div、ul、li、dl、dt、dd、p、h1-h6、blockquote空元素：即系没有内容的HTML元素，例如：br、meta、hr、link、input、img15.简述一下src与href的区别href 是指向网络资源所在位置，建立和当前元素（锚点）或当前文档（链接）之间的链接，用于超链接。src是指向外部资源的位置，指向的内容将会嵌入到文档中当前标签所在位置；在请求src资源时会将其指向的资源下载并应用到文档内，例如js脚本，img图片和

9、frame等元素。当浏览器解析到该元素时，会暂停其他资源的下载和处理，直到将该资源加载、编译、执行完毕，图片和框架等元素也如此，类似于将所指向资源嵌入当前标签内。这也是为什么将js脚本放在底部而不是头部。16.简述同步和异步的区别同步是阻塞模式，异步是非阻塞模式。同步就是指一个进程在执行某个请求的时候，若该请求需要一段时间才能返回信息，那么这个进程将会一直等待下去，直到收到返回信息才继续执行下去；异步是指进程不需要一直等下去，而是继续执行下面的操作，不管其他进程的状态。当有消息返回时系统会通知进程进行处理，这样可以提高执行的效率。17.浏览器的内核分别是什么?IE: trident内核Fire

10、fox：gecko内核Safari：webkit内核Opera：以前是presto内核，Opera现已改用Google Chrome的Blink内核Chrome：Blink(基于webkit，Google与Opera Software共同开发)18.一次完整的HTTP事务是怎样的一个过程？基本流程：a. 域名解析b. 发起TCP的3次握手c. 建立TCP连接后发起http请求d. 服务器端响应http请求，浏览器得到html代码e. 浏览器解析html代码，并请求html代码中的资源f. 浏览器对页面进行渲染呈现给用户19.CSS引入的方式有哪些? link和import的区别是?内联内嵌外链

11、导入区别：同时加载前者无兼容性，后者CSS2.1以下浏览器不支持Link 支持使用javascript改变样式，后者不可20.split() join() 的区别前者是切割成数组的形式，后者是将数组转换成字符串21.document load 和document ready的区别Document.onload 是在结构和样式加载完才执行jsDocument.ready原生种没有这个方法，jquery中有 $().ready(function)22.在Javascript中什么是伪数组？如何将伪数组转化为标准数组？伪数组（类数组）：无法直接调用数组方法或期望length属性有什么特殊的行为，但仍

12、可以对真正数组遍历方法来遍历它们。典型的是函数的argument参数，还有像调用getElementsByTagName,document.childNodes之类的,它们都返回NodeList对象都属于伪数组。可以使用Array.prototype.slice.call(fakeArray)将数组转化为真正的Array对象。23position的absolute与fixed共同点与不同点共同点：1.改变行内元素的呈现方式，display被置为block；2.让元素脱离普通流，不占据空间；3.默认会覆盖到非定位元素上不同点：absolute的”根元素“是可以设置的，而fixed的”根元素“固定

13、为浏览器窗口。当你滚动网页，fixed元素与浏览器窗口之间的距离是不变的。24documen.write和 innerHTML的区别document.write只能重绘整个页面innerHTML可以重绘页面的一部分25.GET和POST的区别，何时使用POST？ GET：一般用于信息获取，使用URL传递参数，对所发送信息的数量也有限制，一般在2000个字符 POST：一般用于修改服务器上的资源，对所发送的信息没有限制。 GET方式需要使用Request.QueryString来取得变量的值，而POST方式通过Request.Form来获取变量的值，也就是说Get是通过地址栏来传值，而Post是

14、通过提交表单来传值。然而，在以下情况中，请使用 POST 请求：无法使用缓存文件（更新服务器上的文件或数据库）向服务器发送大量数据（POST 没有数据量限制）发送包含未知字符的用户输入时，POST 比 GET 更稳定也更可靠26jQuery的美元符号$有什么作用？其实美元符号$只是”jQuery”的别名，它是jQuery的选择器当然你也可以用jQuery来代替$jQuery中就是通过这个美元符号来实现各种灵活的DOM元素选择的27jQuery中有哪几种类型的选择器？可以有3种类型的选择器，如下：1、基本选择器：直接根据id、css类名、元素名返回匹配的dom元素。2、层次选择器：也叫做路径选择

15、器，可以根据路径层次来选择相应的DOM元素。3、过滤选择器：在前面的基础上过滤相关条件，得到匹配的dom元素。28事件绑定和普通事件有什么区别？事件绑定就是针对dom元素的事件，绑定在dom元素上普通事件即为非针对dom元素的事件；29 ajax请求的时候get 和post方式的区别？1、get是把参数数据队列加到提交表单的ACTION属性所指的URL中，值和表单内各个字段一一对应，在URL中可以看到； post是通过HTTP post机制，将表单内各个字段与其内容放置在HTML HEADER内一起传送到ACTION属性所指的URL地址。用户看不到这个过程；2、Get请求有如下特性：它会将数据

16、添加到URL中，通过这种方式传递到服务器，通常利用一个问号？代表URL地址的结尾与数据参数的开端，后面的参数每一个数据参数以“名称=值”的形式出现，参数与参数之间利用一个连接符&来区分。 Post请求有如下特性：数据是放在HTTP主体中的，其组织方式不只一种，有&连接方式，也有分割符方式，可隐藏参数，传递大批数据，比较方便。3、get传送的数据量较小，不能大于2KB； post传送的数据量较大，一般被默认为不受限制。但理论上，因服务器的不同而异.4、get安全性非常低，post安全性较高；（总结：一个在url后面一个放在虚拟载体里面有大小限制安全问题应用不同一个是论坛等只需要请求的，一个是类似

17、修改密码的）30 你为什么要使用jquery？答：因为jQuery是轻量级的框架，大小不到30kb,它有强大的选择器，出色的DOM操作的封装，有可靠的事件处理机制(jQuery在处理事件绑定的时候相当的可靠)，完善的ajax(它的ajax封装的非常的好，不需要考虑复杂浏览器的兼容性和XMLHttpRequest 对象的创建和使用的问题。) 出色的浏览器的兼容性。而且支持链式操作，隐式迭代。行为层和结构层的分离，还支持丰富的插件，jquery的文档也非常的丰富。31 jquery对象和dom对象是怎样转换的？答：jquery转DOM对象:jQuery 对象是一个数组对象，可以通过index的丰富

18、得到相应的DOM对象还可以通过getindex去得到相应的DOM对象。 DOM对象转jQuery对象:$(DOM对象)32 在jquery中你是如何去操作样式的？答: addClass() 来追加样式 removeClass() 来删除样式 toggle() 来切换样式33 你使用过jquery中的动画吗，是怎样用的？hide()和 show() 同时修改多个样式属性。像高度，宽度，不透明度。fadeIn() 和fadeOut() fadeTo() 只改变不透明度slideUp() 和slideDown() slideToggle() 只改变高度 animate() 属于自定义动画的方法. 3

19、4 jquery中如何来获取或和设置属性？jQuery中可以用attr()方法来获取和设置元素属性 removeAttr() 方法来删除元素属性35 子元素选择器和后代选择器元素有什么区别？答:子代元素是找子节点下的所有元素,后代元素是找子节点或子节点的子节点中的元素36 有哪些查询节点的选择器？答：我在公司使用过 :first 查询第一个，:last 查询最后一个，:odd查询奇数但是索引从0开始 :even 查询偶数，:eq(index)查询相等的 ,:gt(index)查询大于index的 ,:lt查询小于index :header 选取所有的标题等37 jQuery 能做什么？答：1

20、获取页面的元素2 修改页面的外观3 改变页面大的内容4 响应用户的页面操作5 为页面添加动态效果6 无需刷新页面，即可以从服务器获取信息7 简化常见的javascript任务38 在jquery中你有没有编写过插件，插件有什么好处？你编写过那些插件？它应该注意那些？答: 插件的好处：对已有的一系列方法或函数的封装，以便在其他地方重新利用，方便后期维护和提高开发效率插件的分类：封装对象方法插件、封装全局函数插件、选择器插件注意的地方：1.插件的文件名推荐命名为jquery.插件名.js，以免和其他的javaScript库插件混淆2.所有的对象方法都应当附加到jQuery.fn对象上，而所有的全局

21、函数都应当附加到jQuery对象本身上3.插件应该返回一个jQuery对象，以保证插件的可链式操作4.避免在插件内部使用$作为jQuery对象的别名,而应使用完整的jQuery来表示，这样可以避免冲突或使用闭包来避免5.所有的方法或函数插件，都应当一分好结尾，否则压缩的时候可能出现问题。在插件头部加上分号，这样可以避免他人的不规范代码给插件带来影响6.在插件中通过$.extent()封装全局函数,选择器插件，扩展已有的object对象通过$.fn.extend()封装对象方法插件39 BS 和CS结构的区别40javascript的本地对象，内置对象和宿主对象？本地对象为array obj regexp等可以new实例化内置对象为gload Math 等不可以实例化的宿主为浏览器自带的document,window 等