Web前端开发工程师笔试题.doc

合集下载

web前端笔试题及答案

web前端笔试题及答案

web前端笔试题及答案一、选择题1. 下列哪个不是JavaScript的数据类型?A. NumberB. StringC. UndefinedD. Array答案:D2. CSS中,以下哪个属性用于设置元素的宽度?A. widthB. heightC. marginD. padding答案:A3. HTML5中,用于定义文档的元数据的标签是:A. <html>B. <head>C. <meta>D. <title>答案:B二、简答题1. 请简述什么是BEM命名方法,并说明其优点。

答案:BEM是Block Element Modifier的缩写,是一种CSS类名命名方法。

它通过将CSS类名分为三个部分:块(Block)、元素(Element)和修饰符(Modifier),来提高CSS的可读性和可维护性。

优点包括:提高代码的可读性,方便团队协作;通过块和元素的命名,可以避免CSS选择器的冲突;修饰符的使用可以方便地覆盖或扩展样式。

2. 请解释什么是跨域资源共享(CORS)以及它是如何解决跨域请求问题的。

答案:跨域资源共享(CORS)是一种安全机制,允许Web页面上的脚本发起跨域HTTP请求。

它通过在HTTP响应头中添加特定的字段来告知浏览器,哪些源可以访问该资源。

CORS通过设置Access-Control-Allow-Origin等响应头,允许或限制来自不同源的请求,从而解决了由于浏览器同源策略导致的跨域请求问题。

三、编程题1. 编写一个JavaScript函数,实现数组中所有数字的累加。

示例代码:```javascriptfunction sumArray(numbers) {let sum = 0;for (let i = 0; i < numbers.length; i++) {sum += numbers[i];}return sum;}```2. 请使用HTML和CSS创建一个简单的登录表单,并包含用户名和密码输入框。

Web前端笔试115道题(带答案及解析)

Web前端笔试115道题(带答案及解析)

Web前端笔试115道题(带答案及解析)1、html5为什么只需要写&lt;!doctype html&gt;?答:html5不是基于sgml(标准通用标记语言),不需要对dtd文件进行引用,但是需要doctype来规范浏览器的行为,否则浏览器将开启怪异模式,而html4.01基于sgml,需要引入dtd,才能告知浏览器文档使用的文档类型2、行内元素有哪些?块级元素有哪些?空(void)元素有哪些?行内元素有:a b span img input select strong (强调的语气)块级元素有:div ul ol li dl dt dd h1 h2 h3 h4…p知名的空元素:&lt;br&gt; &lt;hr&gt; &lt;img&gt; &lt;input&gt;&lt;link&gt; &lt;meta&gt;鲜为人知的是:&lt;area&gt; &lt;base&gt; &lt;col&gt; &lt;command&gt; &lt;embed&gt; &lt;keygen&gt; &lt;param&gt;&lt;source&gt; &lt;track&gt; &lt;wbr&gt;3、页面导入样式时,使用link和@import有什么区别?两者都是外部引用CSS的方式,但是存在一定的区别:区别1:link是XHTML标签,除了加载CSS外,还可以定义RSS等其他事务;@import属于CSS范畴,只能加载CSS。

区别2:link引用CSS时,在页面载入时同时加载;@import需要页面网页完全载入以后加载。

web前端开发工程师笔试试题

web前端开发工程师笔试试题

Web前端开发笔试姓名:电话:日期:1.行内元素有哪些?块级元素有哪些?CSS的盒模型?2.请介绍一下什么是盒子模型?3.如何让一个绝对定位高度宽度为200px的div在body中居中?4.请写一个CSS圆角为15px的样式?5.请描述一下px、rem 、em的区别?6.web网站性能优化的方法?7.解释css sprites,如何使用作用是什么?8.请解释一下优雅降级与渐进增强?9.CSS3有哪些新特性?html5有哪些新特性?10.解决苹果手机ios safari浏览器中输入框有圆角、投影的问题?11.Javascript有哪几种数据类型,并解析一下null12. alert(1-0.9==10-9.9) 返回值是多少13.JS DOM操作——如何添加、移除、移动、复制、创建和查找节点。

14.执行这段代码,输出什么结果15.请填入内容,使得数组从小到大排序;vararr = [16,21,10,5,9,5]; arr.sort()16.以下是html 和jQuery代码片段执行这段代码,输出什么结果<input type='checkbox' name='check'>console.log($("input[type='checkbox']").attr("checked"));console.log($("input[type='checkbox']").prop("checked"));17.以下哪些插或者前端框架件你使用过或者请列出这之外你使用过的Layer icheckswipereasyuisuperslide MUI bootstrap amazeUIweUIAngularJSHui18.是否有线上项目?在项目中遇到的最麻烦的前端问题是什么19.简述同步和异步的区别以及什么是闭包20.一个用户注册信息表单含有电话、箱号、码1-16 的数字以及英文组成,请对注册信息进行表单验证。

Web前端开发笔试题

Web前端开发笔试题

前端研发笔试题备注:请将答案写在答题纸上.一、选择题1.下面标签嵌套正确的是()A. <ul><p>赶集网</p></ul>B. <a href="#"><a href="#">赶集网</a></a>C. <dl><li>赶集网</li></dl>D. <ol><li>赶集网</li></ol>2. 在HTML中,()可以在网页上通过链接直接打开邮件客户端发送邮件。

A. <ahref=”telnet:************”>发送邮件</a>B. <a href=”mail:zh**********”>发送邮件</a>C. <ahref=”mailto:************”>发送邮件</a>D. <a href=”ftp:************”>发送邮件</a>3. 请选出所有的置换元素()(多选)A. imgB. inputC. textareaD. select4.下面哪条声明能固定背景图片()A. background-attachment:fixed;B. background-attachment:scroll;C. background-origin: initial;D. background-clip: initial;5.下列说法正确的是()(多选)A. display: none;不为被隐藏的对象保留其物理空间;B. visibility:hidden;所占据的空间位置仍然存在,仅为视觉上的完全透明;C. visibility:hidden;产生reflow和repaint(回流与重绘);D. visibility:hidden;与display: none;两者没有本质上的区别;6.以下关于盒子模型描述正确的是()A.标准盒子模型中:盒子的总宽度=左右margin + 左右border + 左右padding + widthB.IE盒子模型中:盒子总宽度=左右margin + 左右border + widthC.标准盒子模型中:盒子的总宽度=左右margin + 左右border + widthD.IE盒子模型中:盒子总宽度= width7.英文字母全部转为大写正确的是()A. text-transform: capitalize;B. text-transform: lowercase;C. text-transform: uppercase;D. font-weight: bold;8. 页面有一个按钮button id为 button1,通过原生的js如何禁用?()(多选)A. document.getElementById("button1").readolny= true;B. document.getElementById("button1").setAttribute("readolny","true");C. document.getElementById("button1").disabled = true;D. document.getElementById("button1").setAttribute("disabled", "true");9.页面有一个按钮button id为 button1,通过原生的js 设置背景色为红色?().A. document.getElementById('button1').style.backgroundColor="red";B. document.getElementById('button1').style.backgroundcolor="red";C. document.getElementById('button1').style.backGroundColor="red";D. document.getElementById('button1').style.bgcolor="red";10.使用CSS来格式化网页,共有三种方式,以下哪一种不是( ).A. 在HEAD中引用B. 作为标记来引用C. 在BODY中引用D. 作为文件来引用11. 下述有关border:none以及border:0的区别,描述错误的是?( )(多选)A. border:none表示边框样式无B. border:0表示边框宽度为0C. 当定义了border:none,即隐藏了边框的显示,实际就是边框宽度为0D. 当定义边框时,仅设置边框宽度也可以达到显示的效果12.iframe的使用场景有?( )A. 与第三方域名下的页面共享cookieB. 上传图片,避免当前页刷新C. 左边固定右边自适应的布局D. 资源加载13.通常我们在浏览器内容区看到的内容,都是放入在 ( ) 之间A. <!doctype html>B. <html></html>C. <head></head>D. <body></body>14. 在网站上添加链接使用的标签是( )A. title标签B. img标签C. meta标签D. a标签15.通过分析如下HTML代码,可以得出( )(多选)A.该表格共有2行3列B.该表格中的文字均居中显示C.该表格的边框宽度为10毫米D."员工号"单元个跨2列二、填空题16.CSS中的________属性可为元素设置外边距,改变元素的内填充用______属性。

最新Web前端笔试题(共9页)

最新Web前端笔试题(共9页)

精品资料W e b前端笔试(bǐs hì)题........................................1) 现在(xiànzài)有以下 HTML 代码:<div class="wrapper"><div class="box box1"></div><div class="box box2"></div></div>补全下面(xià mian)的 CSSdiv.wrapper {border: 1px solid#ccc;width: 200px;padding: 10px;// TODO}div.box {width: 50px;height: 50px;border: 1px solid#ccc;}div.box1 {// TODO}div.box2 {// TODO}以达到(dá dào)以下效果:2) 补充(bǔchōng)完成下面的代码:function People (name) {= name;}// TODO// ...//var jerry =new People('Jerry');jerry.sayHi(); // => 'Hi, I am Jerry'var lucy =new People('Lucy');lucy.sayHi(); // => 'Hi, I am Lucy'3) 补充(bǔchōng)下面的代码,尽量多地写出你能想到的实现方案。

var arr = [{ name:'Jerry' },{ name:'Lily' },{ name:'Lucy' },{ name:'Tomy' }];var arr2 =/* TODO */;arr === arr2; // => falsearr[0] === arr2[0]; // => truearr[1] === arr2[1]; // => truearr[2] === arr2[2]; // => truearr[3] === arr2[3]; // => true4) 补充 CSS 代码(dài mǎ),让 p 元素内的文字“垂直”居中(jūzhōng)显示:HTML<p>Jerry is my love.</p>CSSp {height: 30px;border: 1px solid#ccc;// TODO}5) 写出标号处各打印的内容(nèiróng),并解释原因:<script type="text/javascript">var name ='jerry';function sayHi () {return'Hi, I am '+;}var lucy = {name:'Lucy',sayHi: sayHi,sayAnotherHi:function () {return sayHi();}};var tomy = {name:'Tomy'}console.log(sayHi()); // 1:console.log(lucy.sayHi()); // 2:console.log(lucy.sayHi.apply(tomy)); // 3: console.log(lucy.sayAnotherHi()); // 4:</script>6) HTTP是无状态协议,那么网站应该如何(rúhé)记住用户的登录状态?尽量详细回答整个过程。

web前端开发笔试题及答案

web前端开发笔试题及答案

web前端开发笔试题及答案一、选择题(每题2分,共10分)1. HTML5新增的表单元素不包括以下哪个选项?A. emailB. urlC. datetimeD. password答案:C2. 下列哪个选项不是CSS3的新特性?A. 多列布局B. 圆角C. 透明度D. 表格边框合并答案:D3. JavaScript中,以下哪个方法用于获取元素的属性值?A. getAttribute()B. getElementsByTagName()C. getElementsByClassName()D. getElementById()答案:A4. 在JavaScript中,下列哪个不是合法的变量名称?A. _nameB. $nameC. 2nameD. name5. 下列哪个选项不是JavaScript中的保留关键字?A. varB. functionC. classD. return答案:C二、填空题(每题2分,共10分)1. 在HTML中,用于定义最重要的标题的标签是________。

答案:h12. CSS中,用于设置文本颜色的属性是________。

答案:color3. JavaScript中,用于获取当前日期的函数是________。

答案:new Date()4. 在JavaScript中,用于获取页面URL的属性是________。

答案:window.location.href5. 在HTML5中,用于定义导航链接的语义标签是________。

答案:nav三、简答题(每题5分,共20分)1. 请简述HTML5相对于HTML4的新特性。

答案:HTML5相对于HTML4的新特性包括但不限于:语义化标签(如header、footer、section、article等)、表单控件(如email、url、date等)、新的API(如Web Storage、Web Workers、Geolocation 等)、多媒体支持(如audio、video标签)和图形绘制(如canvas2. 请列举至少三种CSS选择器。

Web前端笔试115道题(带答案及解析)

Web前端笔试115道题(带答案及解析)

Web前端笔试115道题(带答案及解析)1、html5为什么只需要写&lt;!doctype html&gt;?答:html5不是基于sgml(标准通用标记语言),不需要对dtd文件进行引用,但是需要doctype来规范浏览器的行为,否则浏览器将开启怪异模式,而html4.01基于sgml,需要引入dtd,才能告知浏览器文档使用的文档类型2、行内元素有哪些?块级元素有哪些?空(void)元素有哪些?行内元素有:a b span img input select strong (强调的语气)块级元素有:div ul ol li dl dt dd h1 h2 h3 h4…p知名的空元素:&lt;br&gt; &lt;hr&gt; &lt;img&gt; &lt;input&gt;&lt;link&gt; &lt;meta&gt;鲜为人知的是:&lt;area&gt; &lt;base&gt; &lt;col&gt; &lt;command&gt; &lt;embed&gt; &lt;keygen&gt; &lt;param&gt;&lt;source&gt; &lt;track&gt; &lt;wbr&gt;3、页面导入样式时,使用link和@import有什么区别?两者都是外部引用CSS的方式,但是存在一定的区别:区别1:link是XHTML标签,除了加载CSS外,还可以定义RSS等其他事务;@import属于CSS范畴,只能加载CSS。

区别2:link引用CSS时,在页面载入时同时加载;@import需要页面网页完全载入以后加载。

【最新】腾讯web前端开发工程师笔试题-word范文 (4页)

【最新】腾讯web前端开发工程师笔试题-word范文 (4页)

本文部分内容来自网络整理,本司不为其真实性负责,如有异议或侵权请及时联系,本司将立即删除!== 本文为word格式,下载后可方便编辑和修改! ==腾讯web前端开发工程师笔试题1、 JS如何得到HTTP的请求头信息和返回的头信息?Javascript中跟response header有关的就两个方法:getResponseHeader 从响应信息中获取指定的http头语法strValue =oXMLHttpRequest.getResponseHeader(bstrHeader);getAllResponseHeaders 获取响应的所有http头语法strValue =oXMLHttpRequest.getAllResponseHeaders();需要注意的是,通常,在IE下不能完整的获取header报头数据,只能取到如下header数据:X-Powered-By:X-UA-Compatible:Keep-Alive:Transfer-Encoding:Content-Type:比如你要获取时间戳,在IE下必须做些特殊处理,需要在后端设置一下,关闭缓存:2、将10进制的数302转为二进制。

十进制转二进制的原理是:用2辗转相除至结果为1将余数和最后的1从下向上倒序写就是结果例如302302/2 = 151 余0151/2 = 75 余175/2 = 37 余137/2 = 18 余118/2 = 9 余09/2 = 4 余14/2 = 2 余02/2 = 1 余0故二进制为100101110所以程序可以写成这样:var a=302;var str=””;while(a>1){str = a%2 + str;a = parseInt(a/2);}str = a+str;3、 js中运算符的优先级(此非原题,为原理题)。

  1. 1、下载文档前请自行甄别文档内容的完整性,平台不提供额外的编辑、内容补充、找答案等附加服务。
  2. 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
  3. 3、如文档侵犯您的权益,请联系客服反馈,我们会尽快为您处理(人工客服工作时间:9:00-18:30)。

Web前端开发工程师笔试题
Web前端开发工程师笔试题篇1
1. 在一个框架的属性面板中,不能设置下面哪一项。

( C )
A.源文件;
B.边框颜色;
C.边框宽度
D.滚动条
2. CSS样式表根据所在网页的位置,可分为?(B )
A.行内样式表、内嵌样式表、混合样式表
B.行内样式表、内嵌样式表、外部样式表
C.外部样式表、内嵌样式表、导入样式表
D.外部样式表、混合样式表、导入样式表
3.对于标签,其中*代表GET或( C )
A. SET
B. PUT
C. POST
D. INPUT
4. HTML代码
表示?(D )
A. 创建表格
B. 创建一个滚动菜单
C. 设置每个表单项的内容
D. 创建一个下拉菜单
5. 在表单中包含性别选项,且默认状态为男被选中,下列正确的是( A )
A.

B.

C.

D.

6. 在CSS中下面哪种方法表示超链接文字在鼠标经过时,超链接文字无下划线?(B )
A. A:link{TEXT-DECORATION: underline }
B. A:hover {TEXT-DECORATION: none}
C. A:active {TEXT-DECORATION: blink }
D. A:visited {TEXT-DECORATION: overline }
7. 下面代码片段,说法正确的是:(B )
.DIV1 { position:absolute;
line-height:22px;
height:58px;
background-color: #FF0000; }
A. Line-height:22px;修饰文本字体大小
B. position:absolute;表示绝对定位,被定位的元素位置固定
C. height:58px; 表示被修饰的元素距离别的元素的距离
D. background-color: #FF0000; 表示被修饰的元素的背景图像
8. 在Dreamweaver 中, 在设置各个框架属性时, 参数Scroll 是用来设置( B )属性的。

A. 是否进行颜色设置
B. 是否出现滚动条
C. 是否设置边框宽度
D. 是否使用默认边框宽度
9. 以下链接到电子邮件的正确格式是(B )
A. 邮箱
B. 邮箱
C. 邮箱
D. 邮箱
10. 若将Dreamweaver中2个横向相邻的单元格合并,则两单元格中文字会( A )
A.文字合并
B.左单元格文字丢失
C.右单元格文字丢失
D.系统出错
Web前端开发工程师笔试题篇2
1. ID为left的DIV标签,用CSS设置DIV的左边为红色实线,下面设置正确的是(C )
A. >
B. >
C. >
D. >
2. html语言中,设置表格边框宽度的标签是?(A )
A.
B.
C.
D.
3. 的意思是?(A )
A. 图像相对于周围的文本左对齐
B. 图像相对于周围的文本右对齐
C. 图像相对于周围的文本底部对齐
D. 图像相对于周围的文本顶部对齐
14. 一个有 3 个框架的Web 页实际上有几个独立的HTML 文件?(C )
A. 2
B. 3
C. 4
D. 5
5. 下列标签可以不成对出现的是( B)
A.〈HTML〉〈/HTML〉
B.〈P〉〈/P〉
C.〈TITLE〉〈/TITLE〉
D.〈BODY〉〈/BODY〉
6. 下列那个不是CSS选择符(A )
A.p
B..td
C.#box
D.shop
7. 在CSS的三种选择符种,哪个优先级最高?( C )
A.标签选择符
B.类选择符号
C.ID选择符
8. 引入样式表的方式有几种?
引入样式表的方式有两种:方式一通过link引入,如
Type= text/css href= css.css 方法二通过import导入如import css.css
9. 关于Document对象,下列叙述正确的是(AC )
a)Document对象表示浏览器中显示的HTML文档
b)Document对象的常用属性bgcolor用来设置文档的背景图片
c)Document对象的常用方法getElementById()用于访问唯
一的一个元素
d)Document对象的常用方法getElementByNames()
10. 在javascript 中,以下哪个变量名是非法的(B )
a)Name
b)9name
c)Name_a
d)Name9
Web前端开发工程师笔试题篇3
1. Javascript可以在以下什么地方执行?(B )
a)服务器端的IE浏览器
b)客户端的IE浏览器
c)在服务器端的tomcat容器里
d)在客户端的tomcat容器里
2. 在javascript中,( B )变量在函数外声明,并可从脚本的任意位置访问
a)局部
b)全局
c)typeOf
d)New
3. 关于javascript说法正确的是(B )。

a)它是面向对象的
b)它是基于对象的
c)它是面向过程的
d)以上说法都不正确
4. 以下哪条语句会产生运行错误(A )
A、var obj = ()
B、var obj = []
C、var obj = {}
D、var obj = //
5. 在javascript中,下拉列表框的(B )方法可从列表中删除一个元素
a)Add( )
b)Remove( )
c)Focus( )
d)blur()
6. 请选择结果为真的表达式(C )
a)null instanceof Object
b)null === undefined
c)null == undefined
d)NaN == NaN
7. 在不指定特殊属性的情况下,哪几种HTML标签可以手动输入文本(AB )
a)
b)
c)
d)
8. 在javascript中,String 对象的方法不包括(D )。

a)charAt()
b)substring()
c)toUpperCase()
d)Length
9. 下拉菜单中,用户更改表单元素Select中的值时,就会调用(A )事件处理程序。

( )
a)onChange
b)onFocus
c)onMouseOver
d)onClick
10. ( C )事件处理程序可用于在用户单击按钮时执行函数
a)onSubmit
b)onChange
c)onClick
d)onBlur。

相关文档
最新文档