Web前端开发面试题一、描述题（每题2分共20题）1、简要的描述一下W3C组织的工作职责答：W3C（万维网联盟）为解决Web应用中不同平台、技术和开发者带来的不兼容性，保障Web信息的顺利和完整流通，网页开发从此在结构、表现、行为上相分离。
2、目前常用的WEB标准静态语言是：答：XHTML3、内联元素有哪些？块级元素有哪些？CSS的盒模型有哪些属性？答：内联元素有a, span, img, input, select, strong等。
块级元素有div, ul, ol, li, dl,dt,dd, h1,h2…,p。
盒模型:margin, padding,width,height,border。
4、改变元素的外边距和内填充用什么？答：margin padding5、对ul li的样式设成无，应该是用什么属性？答：list-style-type:none;6、color:#666666;可缩写为什么?答：color:#666;7、合理的页面布局中常听说结构与表现分离，那么结构和表现分别指什么？答：结构为xhtml，表现为css8、举例你在实践中遇到的IE6 bug，并谈谈解决方案答：如浮动产生双倍边距，用display:inline解决9、谈谈不同浏览器的css hack做法答：所有浏览器通用：height:10px; IE6专用：_height:10px;IE6,IE7公用：*height:10px;IE7专用：*+height:10px;IE7,IE8,FF公用：height:10px !important; 10、CSS中哪些属性可以同父元素继承？答：color, font-size11、你如何理解HTML结构的语意化？答：html本身是没有表现的，我们看到例如h1是粗体，字体大小2em,加粗；strong是加粗的，不要认为这是html，这些其实是html默认的css样式在起作用，所以去掉或样式丢失的时候能让页面呈现清晰的结构不是语义化的HTML特点，但是浏览器都有默认的样式，默认的样式目的也是为了更好的表达html的语义，可以说浏览器的默认样式和HTML结构是不可分割的12、谈谈对css模块化设计的看法？答：css模块化开发是css开发者们都会使用到的方法，它具有结构良好，扩展性强，重用性好等特点，同时有利于团队之间的合作。
13、谈谈对css sprite技术的看法答：css sprite是一种网页图片应用处理方式。
它允许你将一个页面涉及到的所有零星图片都包含到一张图片中去，这样一来，当访问该页面时，载入的图片就不会像以前那样一张一张的慢慢显示出来了，对于当前网络流行的速度不高于200KB的单张图片的所需载入时间基本是差不多的，所以无需顾忌这个问题，加速的关键，不是降低重量，而是减少个数，传统的切图讲究精细，图片规格越小越好，重量越小越好，其实规格大小计算机统一都按byte计算，客户端每显示一张图片都会向服务器发送请求，所以，图片越多请求次数越多，造成延迟的可能性越大。
14、如何居中一个浮动元素?答：设置容器的浮动方式为相对定位，然后确定容器的宽高，比如宽500 高300 的层，然后设置层的外边距。
div{Width:500px;height:300px;Margin: -150px 0 0 -250px;position:relative;left:50%;top:50%;} 15、AJAX readyState有五种状态，分别是0,1,2,3,4，请说明它们对应的意思。
答：0：（未初始化）还没有调用send()方法；1：（载入）已调用send()方法，正在发送请求；2：（载入完成）send()方法执行完成，已经接收到全部响应内容；3：（交互）正在解析响应内容；4：（完成）响应内容解析完成，可以在客户端调用了。
16、谈谈对Javascript语言的理解。
答：JavaScript是一种动态、弱类型、基于原型的语言，通过浏览器可以直接执行，Javascript的一个重要功能就是基于对象的功能，通过基于对象的程序设计，可以用更直观、模块化和可重复使用的方式进行程序开发。
17、谈谈对JS闭包的理解。
答：简单的理解js闭包就是定义在一个函数内部的函数，闭包就是将函数内部和函数外部连接起来的一座桥梁。
闭包可以用在许多地方。
它的最大用处有两个，一个是前面提到的可以读取函数内部的变量，另一个就是让这些变量的值始终保持在内存中。
18、写出几种流行的js开发框架答：jquery, mootools,extjs,yui,prototype;19、html5 websocket是什么？答：WebSocket 目标是在浏览器中实现和服务器端双向通信.双向通信可以拓展浏览器上的应用类型,例如实时的数据推送(股票行情),游戏,聊天/im 等.20、有没有关注HTML5和CSS3?如有请简单说一下您对他们的了解情况。
答：HTML5新标签：header, footer,dialog,aside,figure,section. CSS3特性：实现圆角，阴影，文字特效，动画等等。
二、选择题（每题3分共10题）1、下面的XHTML中，哪个可以正确地标记拆行？（A）A：<br/> B：<break/> C：<br>2、下列哪段是格式良好的XHTML？（B）A：<p>A<b><i>short</b></i>paragraph</p>B：<p>A<b><i>short</i></b>paragraph</p>C：<p>A<b><i>short</b></i>paragraph3、在HTML文档中，引用外部样式表的正确位置是？（D）A：文档的末尾B：文档的顶部C：<body>部分D：<head>部分4、（B）标签可以用于<head>中A：<body> B：<title> C：<image> D：<html>5、a:hover表示超链接文字在（C）时的状态。
A：鼠标按下B：鼠标经过C：鼠标放上去D：访问过后6、CSS中ID选择符在定义的前面要有指示符（D）A：* B：. C：! D：#7、在jquery中下面哪个是用来追加到指定元素的末尾的？（A）A：insertAfter() B：append() C：appendTo() D：after8、下列哪个对象是用来代表特定的窗口URL信息（A）A：location B：history C：form D：frame9、（D）是一个可以执行的JAVASCRIPT代码段。
A：对象B：方法C：事件D：函数10、下列运算方式不属于逻辑运算的是（D）A：!a B：a&&b C：a||b D：a>b三、简答题（每题6分共5题）1、请用xhtml+css布局出如下图形：2、用JS编写一个方法求一个字符串的字节长度new function(s) {if(!arguments.length||!s) return null;if(""==s) return 0;var l=0;for(var i=0;i<s.length;i++){if(s.charCodeAt(i)>255) l+=2;else l++;}alert(l);}3、截取字符串abcdefg的efgvar str = "abcdefg";if (/efg/.test(str)) {var efg = str.substr(str.indexOf("efg"), 3);alert(efg);}4、请实现，鼠标点击页面中的任意标签，alert该标签的名称document.onclick = function (e) {var e = (e ||event);var o = e[“target”] || e[“srcElement”];alert(o.tagName.toLowerCase());}5、创建script,插入到DOM中，加载完毕后callback代码实现function loadScript (url, callback) {var script = document.createElement(“script”);script.type = “text/javascript”;if (script.readyState) { //IEscript.onreadystatechange = function () {if (script.readyState == “loaded” || script.readyState == “complete”) {script.onreadystatechange = null;callback();}};} else {//others:FF, Safari,Chrome, and Operascript.onload = function () {callback()};}script.src = url;document.body.appendChild(script);}。