1、列举3个HTML5标签,3个CSS3新特性,3个ECMAScript5新API。
2、2种方式,实现某DIV元素以50px每秒的速度左移100px。
3、怎样实现javascript代码的异步加载html5提供了一个async的属性javascript有一个defer属性区别:前者不能保证加载的js文件能按照顺序执行,所以两个js文件不能相互依赖
8、用JS实现一个数组合并的方法(要求去重)。Array.prototype.hebing=function(arr2){vararr=this.concat(arr2);for(vari=0;i 9、使用正则表达式给所有string对象添加trim方法。String.prototype.trim=function(){returnthis.replace(/(^\s*)|(\s*$)/g,'')}String.prototype.trim=function(){returnthis.replace(/(^\s*)|(\s*$)/g,'');} 12、列举你经常访问的前端技术网站,并简单描述一下自己的职业规划。 开源中国 和区别:HTML标签的意思是「bold」(粗体),它是一个单纯的样式标签,指定文本要用粗体。是一个带有着重意味的标签,浏览器通常也把它显示为粗体。 3)font-family:Tahoma;font-size:14px;line-height:22px;font-weight:bold;写出CSS的缩写font:bold14px/22pxTahoma; 附:(一些零散的面试题,大概记滴(*^__^*))11)页面上有些图片需要放到最后加载,请基于jquery写一段大致的实现方法13)用css实现鼠标悬浮在a元素上1秒后文字颜色变红14)如何实现仅加载可视区域内的图片 三大类:HTML,CSS,Javascript(jquery) HTML:1.什么是语义化的HTML有何意义?为什么要做到语义化?(高频率考题) 语义化的HTML就是写出的HTML代码,符合内容的结构化(内容语义化),选择合适的标签(代码语义化),能够便于开发者阅读和写出更优雅的代码的同时让浏览器的爬虫和机器很好地解析。 8.Img的alt和title有啥区别?各自作用?alt属性是在你的图片因为某种原因不能加载时在页面显示的提示信息,它会直接输出在原本加载图片的地方,而title属性是在你鼠标悬停在该图片上时显示一个小提示,鼠标离开就没有了9.HTML5的离线储存jakii.manifest{CACHEMANIFESTCACHE1.html//需要缓存的文件NETWORK2.html//不需要缓存的文件}10.iframe有那些缺点?、SEO不友好用户不友好(框架结构有时会让人感到迷惑)链接导航问题(必须正确设置链接,不然让用户很麻烦) CSS:2.CSS的导入方式:import与link方式的区别?优缺点?(高频率)link属于XHTML标签,而@import完全是CSS提供的一种方式加载顺序的差别。当一个页面被加载的时候(就是被浏览者浏览的时候),link引用的CSS会同时被加载,而@import引用的CSS会等到页面全部被下载完再被加载兼容性的差别,link兼容性更好@import不是dom可以控制的3.CSS的优先级?内联和important哪个优先级高?(高频率)important优先级高5.浮动元素清除浮动方法(高频率)①使用无意义标签,比如:
10.谈谈CSShackCSShack由于不同厂商的浏览器,比如InternetExplorer,Safari,MozillaFirefox,Chrome等,或者是同一厂商的浏览器的不同版本,如IE6和IE7,对CSS的解析认识不完全一样,因此会导致生成的页面效果不一样,得不到我们所需要的页面效果。这个时候我们就需要针对不同的浏览器去写不同的CSS,让它能够同时兼容不同的浏览器,能在不同的浏览器中也能得到我们想要的页面效果。简单的说,CSShack的目的就是使你的CSS代码兼容不同的浏览器。当然,我们也可以反过来利用CSShack为不同版本的浏览器定制编写不同的CSS效果。11.CSS中em和px的关系和区别px像素(Pixel)。相对长度单位。像素px是相对于显示器屏幕分辨率而言的。em是相对长度单位。相对于当前对象内文本的字体尺寸。如当前对行内文本的字体尺寸未被人为设置,则相对于浏览器的默认字体尺寸
Javascript:
7.编写一个JavaScript函数parseQueryString,它的用途是把URL参数解析为一个对象varobj=parseQueryString(url);alert(obj.key0)//输出0functionparseQueryString(url){varobj={};varstart=url.indexOf('')+1;varstr=url.substr(start);vararr=str.split('&');for(vari=0;i 10.Vara=‘abcdefghi’,把每三个字中的首字母转为大写。vara="abcdefghi";vararr1=a.split('');for(vari=0;i 12.JSON与XML的区别?优缺点?14.写一个点击input能够弹出当前input索引的函数。varinputs=document.getElementsByTagName('input');for(vari=0;i 15.==与===的区别对于string,number等基础类型,==和===是有区别的不同类型间比较,==之比较“转化成同一类型后的值”看“值”是否相等,===如果类型不同,其结果就是不等同类型比较,直接进行“值”比较,两者结果一样16.Null与undefined的区别null表示"没有对象",即该处不应该有值undefined表示"缺少值",就是此处应该有一个值,但是还没有定义 18.Eval是啥?谈谈对它的理解eval是把字符串当成javascript代码解析 其他: 2.网站性能优化的方法(高频率)后台:用memcached缓存页面静态化mysql优化前台:将CSS放在页面顶端,JS文件放在页面底端使用gzip压缩网页内容尽量减少外部脚本的使用,减少javascript脚本的使用sprite3.响应式布局(高频率):就是一个网站能够兼容多个终端4.前端由哪些部分组成(高频率)UI设计部分html/css页面静态化javascript客户端动态化多媒体化5.W3C标准是啥:结构(Structure)、表现(Presentation)和行为(Behavior)的一系列标准合集 7.为什么利用多个域名来提供网站资源会更有效?节约主域名的连接数,避免了大图片之类的并不一定重要的内容阻塞住主域名上其他后续资源的连接(比如ajax请求)。15、前端页面有哪三层构成,分别是什么作用是什么结构层Html表示层CSS行为层js16、你做的页面在哪些流览器测试过这些浏览器的内核分别是什么Ie(Ie内核)火狐(Gecko)谷歌(webkit)opear(Presto)safria1.javascript的typeof返回哪些数据类型ObjectnumberStringfunctionbooleanunderfind 2.例举3种强制类型转换和2种隐式类型转换强制(parseInt,parseFloat,number)隐式(==–===) 3、ajax请求时,如何解释json数据?使用JSON.parse();4、事件委托是什么?让利用事件冒泡的原理,让自己的所触发的事件,让他的父元素代替执行! 18.javascript的本地对象,内置对象和宿主对象本地对象为arrayobjregexp等可以new实例化内置对象为gloadMath等不可以实例化的宿主为浏览器自带的document,window等 19.documentload和documentready的区别Document.onload是在结构和样式加载完才执行jsDocument.ready原生种没有这个方法,jquery中有$().ready(function) 20,indexOf:查找某个字符在字符串里面位置charAt:查找某个位置的字符串21.fixedrelativeabsolutestatic定位区别 static:没有定位relative元素框偏移某个距离。元素仍保持其未定位前的形状,它原本所占的空间仍保留。相对于原先的位置的移动absolute元素框从文档流完全删除,并相对于其包含块定位。包含块可能是文档中的另一个元素或者是初始包含块。元素原先在正常文档流中所占的空间会关闭,就好像元素原来不存在一样。元素定位后生成一个块级框,而不论原来它在正常流中生成何种类型的框。fixed元素框的表现类似于将position设置为absolute,不过其包含块是视窗本身。 22、css属性overflow属性定义溢出元素内容区的内容会如何处理。如果值为scroll,不论是否需要,用户代理都会提供一种滚动机制。正确 23、flash和js通过什么类如何交互ExternalInterface 24,关于跨域的理解:通过修改document.domain来跨子域使用window.name来进行跨域域名、端口相同,协议不同,属于相同的域(错误) 25,写出结果: 26.domContentLoaded事件早于onload事件HTTP状态码302表示暂时性转移IE6/7/8不支持事件捕获 27,HTML5的离线储存?localStorage长期存储数据,浏览器关闭后数据不丢失;sessionStorage数据在浏览器关闭后自动删除。 28、语义化的理解?用正确的标签做正确的事情!html语义化就是让页面的内容结构化,便于对浏览器、搜索引擎解析;在没有样式CCS情况下也以一种文档格式显示,并且是容易阅读的。搜索引擎的爬虫依赖于标记来确定上下文和各个关键字的权重,利于SEO。使阅读源代码的人对网站更容易将网站分块,便于阅读维护理解。 29、怎样让一个浮动的div水平居中:外边套一个div即可怎样让一个div垂直居中?div{position:absolute;width:100px;height:100px;top:50%;margin-top:-50px;} 30,Node.js的适用场景?高并发、聊天、实时消息推送 31、IE与火狐的事件机制有什么区别?如何阻止冒泡?事件处理机制:IE是事件冒泡、火狐是事件捕获;ev.stopPropagation(); 32、"usestrict";是什么意思使用它的好处和坏处分别是什么?好处:消除Javascript语法的一些不合理、不严谨之处,减少一些怪异行为;-消除代码运行的一些不安全之处,保证代码运行的安全;-为未来新版本的Javascript做好铺垫。坏处:现在网站的JS都会进行压缩,一些文件用了严格模式,而另一些没有。这时这些本来是严格模式的文件,被merge后,这个串就到了文件的中间,不仅没有指示严格模式,反而在压缩后浪费了字节 33、DOM结构——两个节点之间可能存在哪些关系以及如何在节点之间任意移动。当前对象为node返回父节点:node.parentNode返回所有子节点:node.childNodes(包含文本节点及标签节点)返回第一个子节点:node.firstChild返回最后一个子节点:node.lastChild返回同属上一个子节点:node.nextSibling返回同属下一个子节点:node.previousSibling 34、new操作符具体干了什么呢1、创建一个空对象,并且this变量引用该对象,同时还继承了该函数的原型。2、属性和方法被加入到this引用的对象中。35、模块化怎么做?立即执行函数,不暴露私有成员 36、jquery是怎么实现json转为字符串再转换回去的jQuery中没有提供这个功能,所以你需要先编写两个jQuery的扩展:$.fn.stringifyArray=function(array){returnJSON.stringify(array)}$.fn.parseArray=function(array){returnJSON.parse(array)} 37、什么是渐进增强(progressiveenhancement)、优雅降级(gracefuldegradation)呢? 渐进增强progressiveenhancement:针对低版本浏览器进行构建页面,保证最基本的功能,然后再针对高级浏览器进行效果、交互等改进和追加功能达到更好的用户体验。 优雅降级gracefuldegradation:一开始就构建完整的功能,然后再针对低版本浏览器进行兼容。 区别:优雅降级是从复杂的现状开始,并试图减少用户体验的供给,而渐进增强则是从一个非常基础的,能够起作用的版本开始,并不断扩充,以适应未来环境的需要。降级(功能衰减)意味着往回看;而渐进增强则意味着朝前看,同时保证其根基处于安全地带。 38、对Node的优点和缺点提出了自己的看法?*(优点)因为Node是基于事件驱动和无阻塞的,所以非常适合处理并发请求,因此构建在Node上的代理服务器相比其他技术实现(如Ruby)的服务器表现要好得多。*(缺点)Node是一个相对新的开源项目,所以不太稳定,它总是一直在变,而且缺少足够多的第三方库支持。看起来,就像是Ruby/Rails当年的样子。 varstr='1852145998020-888-999845测试021-85421987,19865754';varreg=/(1\d+)|(0\d{2}(\s*-\s*\d+)+)/g;alert(str.match(re)); 42、从输入网址,到用户看到页面,发生了什么??①浏览器分析链接指向页面url②浏览器向DNS请求解析对于网址的ip地址③域名系统的DNS解析出对应服务器的ip地址④浏览器与对应服务器建立TCP连接⑤浏览器发出取文件命令⑥服务器给出响应,把文件发给浏览器⑦释放TCP连接,浏览器显示网页 45、ajax跨域方法及其原理详解:①jsonp方法:用一个 HTML5本地存储localstorage:存储大sessionStoragecookie:存储小 HTTP状态码?200成功304响应禁止包含消息体500服务器错误404页面不存在300重定向 前端开发优化方法:1、图片优化-雪碧图2、css优化-简化代码、压缩代码3、js优化-模块化开发 ajax:什么是AJAX?AJAX=异步JavaScript和XML。AJAX是一种用于创建快速动态网页的技术。通过在后台与服务器进行少量数据交换,AJAX可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新。传统的网页(不使用AJAX)如果需要更新内容,必需重载整个网页面。ajax的交互模型? 基于数据缓存策略Ajax的人机交互模型实现页面与服务器数据交互,从而使页面局部刷新。 同步和异步的区别?同步是阻塞模式,异步是非阻塞模式。同步:脚本会停留并等待服务器发送回复然后再继续异步:脚本允许页面继续其进程并处理可能的回复 如何解决跨域问题?前端对于跨域的解决办法:(1)document.domain+iframe(2)动态创建script标签 1.shift()t:删除数组的第一个元素,返回删除的值。这里是0 2.unshift(3,4):把参数加载数组的前面,返回数组的长度。现在list:中是3,4,0,1,2 3.pop():删除数组的最后一个元素,返回删除的值。这里是2. 4.push(3):将参数加载到数组的最后,返回数组的长度,现在List中时:0,1,2,3 5.concat(3,4):把两个数组拼接起来。 js数组与字符串之间的转换? 一、数组转字符串需要将数组元素用某个字符连接成字符串,示例代码如下: 1vara,b;2a=newArray(0,1,2,3,4);3b=a.join("-"); 二、字符串转数组实现方法为将字符串按某个字符切割成若干个字符串,并以数组形式返回,示例代码如下: 1vars="abc,abcd,aaa";2ss=s.split(",");//在每个逗号(,)处进行分解。 animations动画与transition动画的区别? transition属性是一个简单的动画属性,非常简单非常容易用。可以说它是animation的简化版本,是给普通做简单网页特效用的。如果在transition的动画当中,属性值有了新的变化,则会中断当前的动画执行,并将中断时的属性值提供给新的动画作为起始值来计算新的动画效果。 什么是响应式布局? 响应式布局的开发原理是什么?原理:简单点说响应式布局它是通过CSS中MediaQuery(媒介查询)@media功能,来判断我们的终端设备宽度在多少像素内,然后就执行与之对应的CSS样式。 HTML5常用的框架有哪些? vara=10;fun()functionfun(){vara=a+10;console.log(a);return(a)}console.log(a)console.log(fun())} 看看下面alert的结果是什么? functionb(x,y,a){arguments[2]=10;(arguments像数组,并不是真的数组,是一个Arguments对象可以代表传给函数的参数的个数)alert(a)}b(1,2,3) 什么是闭包? 子函数能被外部调用到,则该作用连上的所有变量都会被保存下来。 编写一个方法求一个字符串的字节长度 arguments参数的集合arguments[0]代表第一个参数arguments.length代表参数的个数!ss是参数if(!s)是说参数不存在,执行returnnull;charCodeAt()方法可返回指定位置的字符的Unicode编码。这个返回值是0-65535之间的整数。 编写一个方法,去掉一个数组中的重复元素? vars=[0,2,3,4,4,0,2];for(vari=0,o={},tmp=[],count=0,l=s.length;i 去除字符串前后空格的办法? varword="good";word=word.replace(/(^\s*)(\s*$)/g,"");alert(word); 用js编写一个方法,每次返回从1到100的任意整数