前端模拟试题_第1页
前端模拟试题_第2页
前端模拟试题_第3页
前端模拟试题_第4页
前端模拟试题_第5页
免费预览已结束，剩余12页可下载查看

下载本文档

版权说明：本文档由用户提供并上传，收益归属内容提供方，若内容存在侵权，请进行举报或认领

文档简介

1、JavaScript 模拟试题一、单选题1. 我们可以在下列哪个HTML 元素中放置Javascript 代码A. <script>B. <javascript>C. <js>D. <scripting>2. 写 "Hello World" 的正确 Javascript 语法是A. ("Hello World")B. "Hello World"C. ("Hello World")D. ("Hello World")3. 插入 Javacript 的

2、正确位置是A. <body> 部分B. <head> 部分C. <body> 部分和 <head> 部分均可4. 引用名为 "" 的外部脚本的正确语法是A. <script src="">B. <script href="">C. <script name="">5. 外部脚本必须包含 <script> 标签吗A.是B.否6. 如何在警告框中写入 "Hello World"A. alertBox=&q

3、uot;Hello World"B. msgBox("Hello World")C. alert("Hello World")D. alertBox("Hello World")7. 如何创建函数A. function:myFunction()B. function myFunction()C. function=myFunction()8. 如何调用名为"myFunction" 的函数A. call function myFunctionB. call myFunction()C. myFunction

4、()9. 如何编写当 i 等于 5 时执行一些语句的条件语句A. if (i=5)B. if i=5 thenC. if i=5D. if i=5 then10. 如何编写当 i 不等于 5 时执行一些语句的条件语句A. if =! 5 thenB. if <>5C. if (i <> 5)D. if (i != 5)11. 在 JavaScript 中，有多少种不同类型的循环A. 两种。 for 循环和 while 循环。循环。B. 四种。 for 循环、 while 循环、do.while循环以及loop.untilC. 一种。 for 循环。12. for 循环如

5、何开始A. for (i <= 5; i+)B. for (i = 0; i <= 5; i+)C. for (i = 0; i <= 5)D. for i = 1 to 513. 如何在 JavaScript中添加注释A. ' This is a commentB. <!-This is a comment->在图片上添加onClick 事件B. 在图片上添加onSubmit 事件C. 在事件中手动提交D. 在事件中自动提交14. 能够返回键盘上的按键所对应字符的事件是(B)A. onKeyDownB. onKeyPressC. onKeyUpD. on

6、MouseOver15. 要动态改变层中的内容可以使用下列哪些方法(A)A. 利用层的innerHTML 改变内容B. 利用层的innerText 改变内容C.可以通过设置层的隐藏和显示来实现D.可以通过设置层的样式属性的display属性来实现16.制作级联菜单功能时调用的是下拉列表框的(B)事件。A. onClickB. onChangeC. selected60.在JavaScript 中Array对象拥有的方法不包括( B)A. sort() 数组排序B. length()计算数组长度C. concat() 数组合并D. reverse。数组元素反转17.以下哪条语句会产生运行错误：(

7、A)A. varobj=();B. varobj=;C. varobj=;D. varobj=/；18 .以下哪个单词不属于javascript 保留字：(B)A. withB. parentC. classD. void19 .请选择结果为真的表达式：(C)A. nullinstanceofObjectB. null= undefinedC. null= undefinedD. NaN = NaN、多选题20 . 请选择对javascript理解有误的：(ABCD)A. JScript 是 javascript的简称Java的开的支持不同(ACEB. javascript 是网景公司开发的一

8、种 Java脚本语言，其目的是为了简化 发难度C. FireFox和IE存在大量兼容性问题的主要原因在于他们对javascript上D. AJAX技术一定要使用 javascript 技术21 . foo对象有att属性，那么获取att属性的值，以下哪些做法是可以的：A.B. foo( “att ”)C. foo “att ” D. foo “att”E. foo “a" +“ t" +" t ” 22 .在不指定特殊属性的，情况下，哪几种HTML标签可以手动输入文本：(AB)A. <TEXTAREA></TEXTAREA>B. <I

9、NPUTtype=" text ” />C. <INPUTtype=" hidden” />D. <DIV></DIV>23 .以下哪些是javascript 的全局函数：(AB。A.escapeB. parseFloatC. evalD. setTimeoutE. alert24 .关于IFrame表述正确的有：(ABCD)A.通过IFrame ,网页可以嵌入其他网页内容，并可以动态更改B.在相同域名下，内嵌的IFrame可以获取外层网页的对象C.在相同域名下，外层网页脚本可以获取IFrame网页内的对象D.可以通过脚本调整IFr

10、ame的大小25 .关于表格表述正确的有：(ABCDEA.表格中可以包含TBOD班素B.表格中可以包含 CAPTIONS素C.表格中可以包含多个 TBOD班素D.表格中可以包含 COLGROUP素E.表格中可以包含COL元素26 .关于IE的window对象表述正确的有：(ACDA.属性本身就是指向 window对象B.()方法可以用来刷新当前页面C.二" ”和的作用都是把当前页面替换成页面D.定义了全局变量g;可以用的方式来存取该变量三、程序题：27 .如何获取表单<select>域的选择部分的文本参考答案：<form name="a">

11、<select name="a" size="1" onchange="sel(this)"><option value="a">1</option>option value="b">2</option>option value="c">3</option></select></form><script>function _sel(obj)alert(" 显示

12、文本："+ 口.text);alert(" 值："+ 口.value); </script>28 .在JavaScript中定时调用函数 foo() 如何写参考答案：function foo()alert("aaaa");a = setTimeout(foo(),100); foo()；8:你做的页面在哪些流览器测试过这些浏览器的内核分别是什么经常遇到的浏 览器的兼容性有哪些怎么会出现解决方法是什么点评：css的兼容性也是大家关注的热点。大家一定要注意多测试。Javascript多浏览器兼容性问题及解决方案兼容性处理要点1、DOCT

13、YP膨响CSS处理2、FF:设置padding 后，div 会增加height 和width , 但IE 不会， 故 需要用Important多设一个height 和width3、FF:支持important , IE 则忽略， 可用important 为FF特别设置样4、div的垂直居中问题：vertical-align:middle;将行距增加到和整个DIV一样高line-height:200px;然后插入文字，就垂直居中了。缺点是要控制内容不要换行5、在mozilla firefox 和IE中的BOX真型解释不一致导致相差2Px解决方法：divmargin:30px!important;

14、margin:28px;注意这两个margin的顺序一定不能写反，important这个属性IE不能识别， 但别的浏览器可以识别。所以在IE下其实解释成这样：divmaring:30px;margin:28px重复定义的话按照最后一个来执行，所以不可以只写 margin:XXpx!important;浏览器差异1、 ul 和 ol 列表缩进问题 消除 ul 、 ol 等列表的缩进时，样式应写成：list-style:none;margin:0px;padding:0px;其中 margin 属性对 IE 有效， padding 属性对 FireFox 有效。 注 经验证，在IE 中，设置 ma

15、rgin:0px 可以去除列表的上下左右缩进、空白以及列表编号或圆点，设置padding 对样式没有影响；在Firefox 中，设置margin:0px 仅仅可以去除上下的空白，设置padding:0px 后仅仅可以去掉左右缩进，还必须设置list- style:none 才 能去除列表编号或圆点。也就是说，在IE 中仅仅设置margin:0px 即可达到最终效果，而在Firefox 中必须同时设置margin:0px 、 padding:0px 以及 list-style:none 三项才能达到最终效果。2、CSSS明问题IE ： filter:progid:。FF： opacity: 。

16、注 最好两个都写，并将opacity 属性放在下面。3、CSS0角问题IE ： ie7 以下版本不支持圆角。FF： -moz-border-radius:4px ，或者 -moz-border-radius-topleft:4px;-moz-border- radius-topright:4px;-moz-border-radius-bottomleft:4px;-moz-border- radius- bottomright:4px; 。注圆角问题是CSS中的经典问题，建议使用JQuery框架集来设置圆角，让这些复杂的问题留给别人去想吧。 不过 jQuery 的圆角只看到支持整个区域的圆角，

17、没有支持边框的圆角， 不过这个边框的圆角可以通过一些简单的手段来实现， 下 次有机会介绍下。4、 cursor:hand VS cursor:pointer问题说明：firefox 不支持hand,但ie支持pointer ,两者都是手形指示。解决方法：统一使用 pointer 。5、字体大小定义不同对字体大小 small 的定义不同， Firefox 中为 13px， 而 IE 中为 16px， 差别挺大。解决方法：使用指定的字体大小如 14px。并列排列的多个元素 （图片或者链接） 的 div 和 div 之间， 代码中的空格和回车在 firefox 中都会被忽略，而 IE 中却默认显示为

18、空格（约3px）。6、CSS®线凹凸边框IE ： border:2px outset; 。FF： -moz-border-top-colors: #d4d0c8 white;-moz-border-left-colors:#d4d0c8 white;-moz-border-right-colors:#404040#808080;-moz-border-bottom-colors:#404040 #808080;浏览器 bug1、 IE 的双边距 bug设置为 float 的 div 在 ie 下设置的 margin 会加倍。 这是一个 ie6 都存在的 bug解决方案：在这个div

19、里面加上 display:inline;例如：<#div id= ” imfloat ” >相应的 css 为 以下为引用的内容：复制代码代码如下:#IamFloatfloat:left;margin:5px;/*IE 下理解为 10px*/display:inline;/*IE 下再理解为 5px*/#IamFloatfloat:left;margin:5px;/*IE 下理解为 10px*/display:inline;/*IE 下再理解为 5px*/关 于CSS中的问题实在太多了，甚至同样的 CSS定义在不同的页面标准中的显 示效果都是不一样的。一个合乎发展的建议是，页面采用

20、标准XHTMIB准编写，较少使用table , CSS定义尽量依照标准 DOM同时兼顾IE、Firefox、Opera等 主流浏览器。很多情况下，FF和Opera的CSS«释标准更贴近CSSfe准，也更 具有规范性。2、 IE 选择符空格 BUG原来一个空格也可以使样今天在给博客的段落样式设置首字符样式的时候发现，式失效。请看以下代码：复制代码代码如下:<!DOCTYPE html PUBLIC "- mozilla firefox 和IE中的BOX真型解释不一致导致相差 2Px解决方法： divmargin:30px!important;margin:28px;注意

21、这两个margin 的顺序一定不能写反， 据阿捷的说法!imPortant 这个属性 IE不能识别，但别的浏览器可以识别。所以在 IE 下其实解释成这样：divmaring:30Px;margin:28Px重复定义的话按照最后一个来执行，所以不可以只写 margin:XXPx!imPortant;和IE6的BOX早释不一致IE5 下 divwidth:300Px;margin:0 10Px 0 10Px;div 的宽度会被解释为 300Px-10Px（ 右填充 ）-10Px（ 左填充 ）最终 div 的宽度为280px,而在IE6和其他浏览器上宽度则是以300px+10px（右填充）+10px

22、（左填充 ）=320Px 来计算的。这时我们可以做如下修改divwidth:300px!important;width :340px;margin:0 10px 0 10px关于这个是什么我也不太明白， 只知道 IE5 和 firefox 都支持但 IE6 不支持， 如 果有人理解的话，请告诉我一声，谢了！：）标签在 Mozilla 中默认是有padding 值的 , 而在 IE 中只有 margin 有值所以先定义 ulmargin:0;padding:0;就能解决大部分问题注意事项：1、 float 的 div 一定要闭合。例如： （ 其中 floatA 、 floatB 的属性已经设置为

23、 float:left;）<#div id="floatA" ><#div id="floatB" ><#div id="NOTfloatC" >这里的NOTfloatC 并不希望继续平移，而是希望往下排。这段代码在IE中毫无问题，问题出在FF。原因是NOTfloatC并非float标签, 必须将float 标签闭合。在 <#div class="floatB"><#div class="NOTfloatC">之间加上 <#div

24、 class="clear">这个 div 一定要注意声明位置， 一定要放在最恰当的地方， 而且必须与两个具有float 属性的 div 同级，之间不能存在嵌套关系，否则会产生异常。并且将 clear 这种样式定义为为如下即可： .clearclear:both;此外，为了让高度能自动适应，要在 wrapper 里面加上 overflow:hidden;9. 如何居中一个浮动元素设置容器的浮动方式为相对定位然后确定容器的宽高 比如宽 500 高 300 的层然后设置层的外边距DivWidth:500px ;height:300px;Margin: -150px 0 0

25、 -250px;position: absolute;left:50%;top:50%;10 .有没有关注HTML体口 CSS及口有请简单说一些您对它们的了解情况!在 HTML 5平台上，视频，音频，图象，动画，以及同电脑的交互都被标准化。那么我们来看一下HTML5勺技术概览有哪些：HTML珈增和移除的元素HTML珈增了很多多媒体和交互性元素如 video, audio,在HTML转中如果要嵌入一个视频或是音频的话需要引入一大段的代码，还有兼容各个浏览器，而HTML队需要通过引入一个标签就可以，就像 img标签一样方便。HTML5寸表单的支持HTML5®供了强大的控件类型如url,

26、email, date, tel等，强大的约束属 性， 如 required 表示必填， 文件上传的 accept 属性， 以及一些表单重复元素模 型的支持，HTML班提交表单的时候还可 以设置提交的方式为XML交方式， 这样服务器端接收到的数据将是XMLB式，HTML5勺表单被定义为“ Web Forms ”，目前+对 Web Forms 的支持较为完美。HTML5 DO疑化HTML5勺 Javascript APIsHTML5fc Javascript 上面新增了哪些API呢Video/Audio: HTML5 为 Video 和 Audio 提供了 API 来让开发者控制他们自己的 用户

27、界面，如可以播放或暂停媒体内容。CSS3CSS3寸于我们We加发者来说不只是新奇的技术，更重要的是这些全新概念的 web应用给我们带来更多无限的可能性，也极大地提高了我们的开发效率。我们 将不必再依赖图片或者Javascript 去完成圆角、多背景、用户自定义字体、 3D动画、渐变、盒阴影、文字阴影、透明度等提高Wet®计质量的特色应用。CSS3寸于动画的支持CSS3支持的动画类型有：transform(变换)、transition( 过渡)和 animation( 动画 ) 。你可以对特定的属性设置transition ， transiton 和animation 的区别不大， a

28、nimation 的动画是自己定义的，面向的更多的是脚本 开发者，往往更加 复杂。11 .你怎么来实现下面这个设计图 , 主要讲述思路 (效果图省略)13:如果让你来制作一个访问量很高的大型网站，你会如何来管理所有CSW件、JS与图片14：你对前端界面工程师这个职位是怎么样理解的它的前景会怎么样Javascript1： js 是什么， js 和 html 的开发如何结合2. 怎样添加、移除、移动、复制、创建和查找节点3. 怎样使用事件以及IE和DO邮件模型之间存在哪些主要差别4. 面向对象编程:b 怎么继承 a5. 看看下面 alert 的结果是什么view sourceprint b(x,

29、y, a) .arguments2 = 10;.alert(a);b(1, 2, 3);如果函数体改成下面，结果又会是什么a = 10;alert(arguments2 );6. 请编写一个JavaScript函数parseQueryString ,它的用途是把URL参数解析为一个对象var obj = parseQueryString（url）;alert 浏览器问题2. 历史后退状态问题3. 跨域问题跨浏览器的问题因为现在有很多的开元的框架已经解决了，我们无需为 此而烦恼。历史后退状态问题我们可以使用一个数组来保存历史纪录，然后把这些数据村到历史对象中去，中的也可以解决，并且还有很多的开元

30、框架给与支持， 这样问题就不是很大。跨域的问题就不是很好的解决，但是还是有办法的，一下给出一些基本的解决方案供大家选择：1 .使用代理，你可以使用web端的程序编写代理程序，把所有的ajax（动 态网站静态化）请求的数据进行转发，web程序可以使php（做为现在的主流开发 语言 ） ， jsp（SUN 企业级应用的首选） ， asp 等所有的编程语言。相信大家对这种方式一定很熟悉，这里就不详细的介绍了。2 . 使用 iframe 的方式来定势的刷新叶面，这种方式只是取得数据来显示， 并不能真正的和求得的数据进行交互， 转化成本页面的动态数据， 不是很可 取，应用也不是很多，我也忽略不去讨论了。

31、3 .使用apache（Unix平台最流行的 WEE®务器平台）的代理功能，主要就 是apache（Unix平台最流行的WEES艮务器平台）的方向代理，或者是url从定向， 你也可以把其他的站点直接的挂在自己的网站上， 这样的方式可能会友邦权的问 题，多的九部介绍了，有兴趣的本有可以自己实践以下。4 . 使用 script 标签的方式， 这样的话就可以保正使用真正的 ajax（ 动 态网站静态化 ） 来跨域，并且可以使用返回来的数据，发誓很简单，在我们的后 台程序处理后的到的结果都直接的用 javascript 的方式返回，在我们的 html 中直接的使用返回数据的变量就可以了一个简

32、单的例子8. 什么是闭包下面这个ul ，如何点击每一列的时候alert 其 index<ul id= ” test ” ><li> 这是第一条</li><li>这是第二条</li><li> 这是第三条</li></ul>9. 最近看的一篇Javascript 的文章是10. 常使用的库有哪些常用的前端开发工具开发过什么应用或组件pageSpeed .Yslow,Fiddler 、 fireBug11. 说说YSlow（可以详细一点）这个插件可以分析网站的页面， 并告诉你为了提高网站性能， 如何基于某

33、些规则而进行优化。网页制作方向的题目1. 什么是网站重构div+css 的布局较 table 布局有什么优点2. 如何理解 css 盒模型3. 平时做网页经常使用哪些 hack4. 如何理解表现与内容相分离5. 如何解决 ie6 的双边距问题6. 如何定义高度为 1px 的容器 heigh ： 1px; width:10px; background:#000;overflow:hiddenie6 下这个问题是默认行高造成的，overflow:hidden | zoom: | line- height:1px 这样也可以解决7. 如何实现一个层在浏览器中垂直左右居中 margin ： auto8

34、. 如何解决 ie6 的 3 像素问题 _zoom:1; margin-left: value; _margin-left: value-3px;9. 为什么 FF 下文本无法撑开容器的高度如何解决清楚浮动10. 怎么样才能让层显示在FLASHY上呢 解决的办法是给FLAS股置透明属性<param name="wmode" value="transparent" /> 或者 <param name="wmode" value="opaque" />1、答：把"未采用CSS大量使用H

35、TMLS行定位、布局，或者虽然已经采 用CSS但是未遵循HTM结构化标准的站点“变成”让标记回归标记的原本意 义 通过在HTMLt档中使用结构化的标记以及用 CSS空制页面表现，使页面的实际 内容与它们呈现的格式相分离的站点。" 的过程就是网站重构网站为什么要进行重构（网站重构的好处）a、使页面加载得更快速；b、降低带宽带来的费用：节约成本；c、让你在修改设计时更有效率而代价更低；d、帮助你的整个站点保持视觉的一致性；e、更利于搜索引擎的检索（符合SEO的规范）；f、令站点更容易被各种浏览器和用户访问（包括手机、PDAffi残障人士使用的文字浏览器）；g、兼容不容忽视的Mozilla

36、系浏览器(Firefox份额)；h、提高你的职场竞争实力(事实上也就是降低失业的风险)。div+css 的布局较 table 布局有什么优点 :1、改版的时候更方便只要改 css 文件。2、页面加载速度更快、结构化清晰、页面显示简洁。3、表现与结构相分离。4、易于优化(seo)搜索引擎更友 好，排名更容易靠前。答：2.如何理解css盒模型：每个HTME素都是长方形盒子外边局 (margin) 、内边距 (padding) 、边框 (border);答： 3. 平时做网页用的 css hackIe6 * _; ie7 *, *+,!important; ff !important.答：4.表现与

37、结构相分离简单的说就是 HTM叶只有标签元素表现完全是 由CSS文件控制的答： 5. 解决 ie6 双边距问题块级元素就加 display ： inline ；行内元素转块 级元素 display ： inline 后面再加 display ： table6. 如何定义高度为 1px 的容器heigh ： 1px; width:10px; background:#000; overflow:hiddenie6 下这 个问题是默认行高造成的， overflow:hidden | zoom: | line-height:1px 这样也可以解决7. 如何实现一个层在浏览器中垂直左右居中margin

38、： auto8. 如何解决 ie6 的 3 像素 问题_zoom:1; margin-left: value; _margin-left: value-3px;9. 为什么FF下文本无法撑开容器的高度如何解决消除浮动 .clear clear:both; height:0px; overflow:hidden;10.怎么样才能让层显示在 FLASHY上呢解决的办法是给FLASHY置透明属性<param name="wmode" value="transparent” /> 或者 <param name="wmode value=&quo

39、t;opaque" />补充：1、margin-left:10Px在 FF和 IE6 下显示问题。IE6 显示 20px,FF 显示 10px。用!important就可以解决了。margin-left:10Px !important;margin-left:5px;2、cursor:hand在FF不显示小手，如何解决一句话：cursor;pointer;3、要求在FF显示height为20px;IE6下显示height为25px;IE7下显示height 为 30Px.#testheight:20px;*html #testheight:25px;*+html #testhe

40、ight:30px;这个以前我们说过，请参考 【IE6的疯狂Bug之九】解决CSS1容性 最常用的"Haker"三个就写上，FF只认识第一个#test,IE6 只认识第二个*html #test , IE7 只认识第三个*+html #testPS: DTDW力口上 <!DOCTYPE HTML PUBLIC “-learclear:both;font-size:0px;height:1px,这样解决有一个小小的问题，高度会多一个像素。还有一种解决方法，给当前层 加上一个伪类#test:after content: "." display: block;height: 0; clear: both;visibility: hidden;1 .超链接访问过后hover样式就不出现的问题被点击访问过的超链接样式不在具有hover和active 了，解决方法是改变CSS属性的排歹1顺序:L-V-H-A的双倍边距BUG例如 :<style type="text/css">body margin:0div

人人文库> 全部分类> 教育资料 > 备课教案

温馨提示

  • 1. 本站所有资源如无特殊说明，都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
  • 2. 本站的文档不包含任何第三方提供的附件图纸等，如果需要附件，请联系上传者。文件的所有权益归上传用户所有。
  • 3. 本站RAR压缩包中若带图纸，网页内容里面会有图纸预览，若没有图纸预览就没有图纸。
  • 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
  • 5. 人人文库网仅提供信息存储空间，仅对用户上传内容的表现方式做保护处理，对用户上传分享的文档内容本身不做任何修改或编辑，并不能对任何下载内容负责。
  • 6. 下载文件中如有侵权或不适当内容，请与我们联系，我们立即纠正。
  • 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。

最新文档

评论

0/150

提交评论