精华内容
下载资源
问答
  • web前端笔试选择题

    2019-10-02 13:26:42
    选择一项) 。 (D )  A for(var i =0; i; i++)  B for(var i =0; i(3); i++)  C for(var i =0; i(); i++)  D for(var i =0; i; i++)    9.  制作级联菜单功能时调用的...

    1. 要动态改变层中内容可以使用的方法有(AB )

     

    a)innerHTML 

    b)innerText 

    c)通过设置层的隐藏和显示来实现

    d)通过设置层的样式属性的display属性

     

    2. 当按键盘A时,使用onKeyDown事件打印event.keyCode的结果是(

     

    a)65 

    b)13 

    c)97 

    d)37 

     

    3. javascript里,下列选项中不属于数组方法的是(B);

     

    a)sort() 

    b)length() 

    c)concat() 

    d)reverse() 

    4. 下列哪一个选项可以用来检索被选定的选项的索引号?(B) 

    a)disabled 

    b)selectedIndex 

    c)option 

    d)multiple 

     

    1. 希望图片具有”提交”按钮同样的功能,该如何编写表单提交?(A ) 

     

    a)在图片的onClick事件中手动提交

    b)在图片上添加onSubmit事件

    c)在图片的onSubmit事件中手动提交

    d)在表单中自动提交

     

    6. 使div层和文本框处在同一行的代码正确的是(D ); 

    a) 

    b) 

    c) 

    d) 

    1. 下列选项中,描述正确的是(选择两项( AD ) 

     

    a)options.add(new Option(„a‟,'A‟))可以动态添加一个下拉列表选项

    b)option.add(new Option(„a‟,'A‟))可以动态添加一个下拉列表选项

    c)new Option(„a‟,'A‟)‟a' 表示列表选项的值,‟A'            用于在页面中显示

    d)new Option(„a‟,'A‟)‟A' 表示列表选项的值‟a' 用于在页面中显示

     

    8. var emp = new Array(3); for(var i in emp) 以下答案中能与for循环代码互换的是: (选择一项)

    (D ) 

    A for(var i =0; i<emp; i++) 

    B for(var i =0; i<Array(3); i++) 

    C for(var i =0; i<emp.length(); i++) 

    D for(var i =0; i<emp.length; i++) 

     

    9. 制作级联菜单功能时调用的是下拉列表框的()事件。

     

    a)onChange 

    b)onFocus 

    c)selected 

    d)onClick 

     

    10. 下列声明数组的语句中,错误的选项是()。

     

    a)Var arry= new Array() 

    b)Var arry=new Array(3) 

    c)Var arry[]=new Array(3)(4) 

    d)Var arry=new Array(„3‟,‟4‟)

     

    11. 下列属性哪一个能够实现层的隐藏?(C 

     

    a)display:fals 

    b)display:hidden 

    c)display:none 

    d)display:” ”

     

    12. 下列哪一个选项不属于document对象的方法?(D 

     

    a)focus() 

    b)getElementById() 

    c)getElementsByName() 

    d)bgColor() 

     

    13. 下列哪项是按下键盘事件(AB ) 

    a)onKeyDown 

    b)onKeyPress 

    c)keyCode 

    d)onMouseOver 

    14. javascript进行表单验证的目的是(

     

    a)把用户的正确信息提交给服务器

    b)检查提交的数据必须符合实际

    c)使得页面变得美观、大方

    d)减轻服务器端的压力

     

    15.display属性值的常用取值不包括(C ) 

    a)inline 

    b)block 

    c)hidden 

    d)none 


    16. 以下有关pixelTop属性与top属性的说法正确的是。(D ) 

    a)都是Location对象的属性

    b)使用时返回值都是字符串

    c)都是返回以像素为单位的数值

    d)以上都不对

     

    17. 使用open方法打开具有浏览器工具条,地址栏,菜单栏的窗口,下列选项正确的是__D__ 

    a)open("x.html","HI","toolbas=1,scrollbars=1,status=1"); 

    b)open("HI","scrollbars=1,location=1,status=1"); 

    c)open("x.html","status=yes,menubar=1,location=1"); 

    d)open("x.html","HI","toolbas=yes,menubar=1,location=1"); 

     

    18. 下面关闭名为mydiv的层的代码正确的是(C ) 

    a)document.getElementById(mydiv).style.display="none"; 

    b)document.getElementById("mydiv").style.display=none; 

    c)document.getElementById("mydiv").style.display="none"; 

    d)document.getElementById("mydiv").style.display=="none"; 

     

    19. 为什么要使用Div+CSS

    布局形式与内容分离大大减少页面代码,提高页面浏览速度结构清晰,有利于SEO 缩短改版时间,布局更方便一次设计,多次使用 

     

     

    1. Block元素的特点是什么?哪些元素默认为Block元素

    总是在新行上开始;高度,行高以及顶和底边距都可控制;宽度缺省是它的容器的100%,除非设定一个宽度

    是块元素的有:div ul ol li dl dt dd h1 h2 h3 h4…p

    21. inline元素的特点是什么?哪些元素属于inline元素

    和其他元素都在一行上;

    高,行高及顶和底边距不可改变;宽度就是它的文字或图片的宽度,不可改变。

    inline元素的有:a b span img input select strong(强调的语气)

     

    22. javascript中表达式parseInt(“X8X8”)+paseFloat(„8‟)的结果是什么?( C) 

    a)8+8 

    b)88 

    c)16 

    d)“8”+‟8

      

    23. String对象的方法不包括(C ) 

    a)charAt()

    b)substring() 

    c)length 

    d)toUpperCase() 

     

    24. 关于setTimeout(“check”,10)中说法正确的是( D) 

    a)程序循环执行10

    b)Check函数每10秒执行一次

    c)10做为参数传给函数check 

    d)Check函数每10毫秒执行一次

     

    25. 以下哪个单词不属于javascript关键字:C)

    a)with 

    b)parent 

    c)class 

    d)void 

    转载于:https://www.cnblogs.com/mehjb/p/6079854.html

    展开全文
  • Web前端笔试题目

    千次阅读 2018-04-06 11:58:26
     由上分析知道,@import url(style.css) 和@import url(“style.css”)是最优的选择,兼容的浏览器最多。  从字节优化的角度来看@import url(style.css)最值得推荐。 4、常见的浏览器内核有哪些? 使用Trident内核...

    1、html5为什么只需要写<!doctype html>?

    因为html5不是基于sgml(标准通用标记语言),不需要写dtd文件进行引用,html4.01是基于sgml,需要引入dtd.,才能告知浏览器文档使用的文档类型每个html文件都需要引入doctype来规范浏览器的行为,否则浏览器将开启怪异模式。

    2、行内元素有哪些?块级元素有哪些?空(void)元素有哪些?

    行内元素:span,a,i,img,input,strong,select。

    块及元素:div,p,ul,li,ol,dl,dt,dd,h1,h2...

    空元素:<br/>,<hr/><img/><input/><link/><meta/>

    不常用的标签

    <area><base><col><command><embed><keygen><param><source><track><wbr>

    3、页面导入样式时,使用link@import有什么区别?

    两者都是外部引用css的方式,但是存在一定的区别:

    区别1:link是xhtml标签,除了加载css外,还可以定义rss等其他事物;@import属于css范畴,只能加载css

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

    区别3:link是Xhtml标签,无兼容问题;@import是在css2.1提出的,低版本的浏览器不支持

    区别4:link支持使用javascript控制DOM去改变样式;而@import不支持

        补充:@import最优写法

        @import的写法一般有下列几种:

        @import ‘style.css’ //Windows IE4/ NS4, Mac OS X IE5, Macintosh IE4/IE5/NS4不识别

        @import “style.css” //Windows IE4/ NS4, Macintosh IE4/NS4不识别

        @import url(style.css) //Windows NS4, Macintosh NS4不识别

        @import url(‘style.css’) //Windows NS4, Mac OS X IE5, Macintosh IE4/IE5/NS4不识别

        @import url(“style.css”) //Windows NS4, Macintosh NS4不识别

        由上分析知道,@import url(style.css) 和@import url(“style.css”)是最优的选择,兼容的浏览器最多。

        从字节优化的角度来看@import url(style.css)最值得推荐。

    4、常见的浏览器内核有哪些?

    使用Trident内核的浏览器:IE、Maxthon、TT、The weorld等

    使用Gecko内核的浏览器:Netcape6及以上版本、FireFox、MozillaSuite/SeaMonkery;

    使用Presto内核的浏览器:Oprea7及以上版本;

    使用Webkit内核的浏览器:Safari Chrome

    展开全文
  • web前端笔试题

    2019-02-21 15:05:07
    web前端工程师笔试题题目不多,涵盖了大多公司会问到的问题
  • 关于Web前端及百度web前端笔试面试题目 随着各大互联网公司设立了Web前端开发工程师、设计工程师等职位,web前端越来越得到互联网企业的认可。而且其重视程度与地位也随着浏览器 端的富客户端的体现而日益提高。 ...

    关于Web前端及百度web前端笔试面试题目

    随着各大互联网公司设立了Web前端开发工程师、设计工程师等职位,web前端越来越得到互联网企业的认可。而且其重视程度与地位也随着浏览器 端的富客户端的体现而日益提高。 眼前对HTML5的未来和走向,业内的预测是会和Flash、Silverlight等相结合,从而取代传统的客户端应用程序。而实现这个目标的客户端核 心工作是有Web前端工程师来完成的。 从另一个角度,对于web产品来说,交互和用户体验是产品的第一价值,这部分价值的体现就是在web前端。可以说web前端是一个web产品的长相和谈 吐、行为。

         下面就简单的说明一下web前端的组成部分。

    1. UI设计部分

       这是web产品化的第一步。这个部分通常在稍大型的公司里,被单独设立为一个部门或者一些人来工作。主要是要掌握Photo, AI,可以很快的将创意转化为平面设计图,并制作PNG等小图片。 同时,UI设计还要预包含用户交互设计的元素,如何和用户交互的基本原型等。

    2. HTML/CSS,页面静态化

    这是web产品化的2步,就是将UI设计师的设计图切成静态页面。这里的“切”不是单纯的切,而是使用css里面背景色和边框样式等方式对设计原稿 进行解读,并形成符合web标准的html代码。这里web前端还需要将图片、html页面以及css样式进行合理的文件分布安排等

    3.Javascript, AS 客户端动态化

    这是web产品化的3步,工程师使用DOM操作、AJAX,实现数据和服务端的通信以及本地样式的切换。同时,由于Javascript、 AS是一门动态语言,所以这部分的编码要求web前端工程师有较好的编码习惯,能写高效率的OOP代码,并对代码进行压缩上线以降低带宽消耗等。

    4.Flash、Silverlight、Video    多媒体化

    这部分针对不同web产品有不同的要求,通常要求是可以使用Flash和web、Server进行交互,并对Flash进行设计与开发。

    5.PHP、Java等CGI, 服务端通信基本知识和编码

    这部分主要是更好的使用Ajax等技术,了解服务端的工作方式将更有利于web前端工程师工作的开展。通常优秀的web前端工程师都是对服务端的一 种开发语言很了解。

    下面是webryan整理的百度web前端笔试和面试的一些题目和过程,提供给大家借鉴。

    百度web前端笔试试卷上的题目:

    1.判断字符串是否是这样组成的,第一个必须是字母,后面可以是字母、数字、下划线,总长度为5-20
    2.截取字符串abcdefg的efg
    3.让一个input的背景颜色变成红色
    4。给一个页面,写html css
    5。div的高宽等于浏览器可见区域的高宽,浏览器滚动,div始终覆盖浏览器的整个可见区域
    6。判断一个字符串中出现次数最多的字符,统计这个次数
    7。IE与FF脚本兼容性问题

    又重新问的是1,4,6,7,这次问出题者的意图,并且让给出7的更多答案,以及IE FF不兼容的原因
    然后看了看简历,没有问简历上的项目,而是让自己随便谈谈
    1对于web客户端技术未来趋势发展谈谈看法
    javas
    cript + ajax=RIA
    Adobe Flash AS 3
    Flex
    Sliveright
    2web开发团队人员应该如何分工协作
    布局 CSS 脚本
    比如脚本人员长期的积累可能铸造类型YUI这样的产品级脚本库(亮点)
    3web开发曾经的团队有没有别人遇到问题,什么问题,向你请教
    4如果要实习,什么时候可以
    5自己在开发的过程中遇到什么问题,谈谈看法
    6web开发脚本开发环境用什么、调试用什么
    试过aptana,现在就用editplus
    调试肯定用firebug,ie下看页面DOM用IEInspector
    7如果有个新技术,现在需要掌握,你会怎么做
    新技术的发现我一般是通过RSS工具,比如我用GoogleReader
    每天有半个小时左右在看最新的资讯、技术走向
    发现新技术,首先有个大概了解,如果有深入的必要
    我一般会看他的官网,比如jquery,我会搜索到www.jquery.com,然后看Docs、samples
    如果要用到项目中,有困难的问题,我会svn得到最新的这个技术的源码,深入跟踪进去,看实现原理
    一般现在涌现的技术都是opensource

    提问时间
    1百度web开发脚本是否有做类似YUI库的打算
    2百度web开发工程师打算招多少人

    百度电话二面回忆 web开发部–web开发工程师

    首先是自我介绍
    然后谈谈做的web项目
    然后开始问技术问题

    前端开发的优化问题
    答:
    产品发布时,js的压缩,即函数名替换、整个文件压缩成一行
    css开发的时候 注释写清楚,先有个base.css,然后根据不同页面需要再加css,发布的时候将css中的一个定义写成一行,目的是压缩文件大小
    最终发布的时候甚至可以将css,js分别压缩成一个文件,甚至css、js通过技巧压缩到一个里边(亮点)
    这样的目的是,减少用户访问web产品的http连接数

    web前端产品的开发流程
    答:首先根据产品的定位、用户群,确定配色,然后纸上设计整体布局,然后png或者psd出效果图,切出需要的小图片,然后手写代码div+css构造出 页面,然后根据功能写脚本
    参考126邮箱首页,将所有小图片放到一个图片中,通过css的background-position实现页面,还是为了优化,减少http连接数

    规避javascript多人开发函数重名问题
    答:首先是通过命名规范,比如根据不同的开发人员实现的功能,在函数名加前缀,虽然函数名看起来复杂,发布的时候还是可以替换,从而优化。
    还有一种办法是,每个开发人员都把自己的函数封装到类中,然后调用的时候即使函数名相同,但是因为是要类.函数名来调用,所以也减少了重复的可能性。

    javascript面向对象中继承实现
    答:我是用prototype.js extend.js扩展
    然后子类中parent.initialize()…
    答的不好
    正确答案:

    // 1. 构造器
    function Animal() {};
    function Mammal() {};
    function Canine() {};
    function Dog() {};
    // 2. 原型链表
    Mammal.prototype = new Animal();
    Canine.prototype = new Mammal();
    Dog.prototype = new Canine();

    prototype.js实现的基本原理
    答:
    将功能封装
    比如Ajax.Request,还是有判断浏览器的代码;Position这样的实现页面元素位置的计算

    prototye太大,如果一个页面功能不需要这样的,自己实现,怎么做
    答:首先页面、css、脚本分离之后,脚本中将整个模块功能写成一个类var Do={}
    其中初始化函数init:function(){},然后最后做Do.init()
    其中init会对页面上form中需要交互的元素绑定事件,比如$(’input1′).on
    click=function(){}

    IE、FF下面脚本的区别
    答:
    1.IE有outerHTML,FF没有
    2.页面元素id,IE可以直接取,FF必须document.getElementById()
    3.Ajax里边FF是new XMLHttpRequest,而IE是
    try new ActiveXObject(’Msxml2.XMLHTTP’) try new ActiveXObject(’Microsoft.XMLHTTP’)

    FF下面实现outerHTML
    答:.parenet.firstChild .parent.innerHTML
    这个没答好
    正确答案:原理是,get:取到这个标签的tagname,然后属性循环构造成这个标签的属性
    set:把字符串用insertBefore插入到这个元素前面,然后removeChild这个元素

    <head>
    <SCRIPT LANGUAGE=”JavaS
    cript”>
    <!–
    if(typeof(HTMLElement)!=”undefined” && !window.opera)
    {
    HTMLElement.prototype.__defineGetter__(”outerHTML”,function()
    {
    var a=this.attributes, str=”<”+this.tagName, i=0;
    for(;i<a.length;i++)
    if(a[i].specified)
    str+=” “+a[i].name+’=”‘+a[i].value+’”‘;
    if(!this.canHaveChildren)
    return str+” />”;
    return str+”>”+this.innerHTML+”</”+this.tagName+”>”;
    });
    HTMLElement.prototype.__defineSetter__(”outerHTML”,function(s)
    {
    var d = document.createElement(”DIV”); d.innerHTML = s;
    for(var i=0; i<d.childNodes.length; i++)
    this.parentNode.insertBefore(d.childNodes[i], this);
    this.parentNode.removeChild(this);
    });
    HTMLElement.prototype.__defineGetter__(”canHaveChildren”,function()
    {
    return !/^(area|base|basefont|col|frame|hr|img|br|input|isindex|link|meta|param)$/.test(this.tagName.toLowerCase());
    });
    }
    //–>
    </SCRIPT>

    IE、FF下面CSS的解释区别
    答:
    1.png透明背景,FF下面没有问题,IE需要用滤镜通道
    2.z-index在IE、FF下面的解释问题,

    IE会认为第一个z-index=0
    3.长字符串,word-wrap:break-all可以解决IE,但是FF需要overflow:hidden才行
    冯舒娅补充:
    1、有些标签在ff中不能用,比如button
    2、滤镜
    3、鼠标cursor:hand cursor:pointer
    4、div的高度自适应
    5、对box模型解析不一样
    6、ul、ol的padding和margin

    IE都能识别*,标准浏览器(如FF)不能识别*;
    IE6能识别*,但不能识别 !imp
    ortant;
    IE7能识别*,也能识别 !imp
    ortant;
    FF不能识别*,但能识别 !imp
    ortant;
    例如style=”*width:10px;!imp
    ortant width:20px;”
    这样在IE6下宽度为10px,在IE7下宽度时20px

    web前端技术的展望
    答:javas
    cript ajax;flash AS;Flex;Sliveright
    附上网上的百度web开发工程师笔试问题集

    1编写一个方法 求一个字符串的字节长度

    <script language=”javascript” type=”text/javascript”>
    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);
    }(”hello你好,我好,大家好!world!”);
    </script>

    2编写一个方法 去掉一个数组的重复元素

    <script language=”javascript” type=”text/javascript”>
    Array.prototype.strip=function()
    {
    if(this.length<2) return [this[0]]||[];
    var arr=[];
    for(var i=0;i<this.length;i++)
    {
    arr.push(this.splice(i–,1));
    for(var j=0;j<this.length;j++)
    {
    if(this[j]==arr[arr.length-1])
    {
    this.splice(j–,1);
    }
    }
    }
    return arr;
    }
    var arr=["abc",85,"abc",85,8,8,1,2,5,4,7,8];
    alert(arr.strip());
    </script>

    3说出3条以上ff和ie的脚本兼容问题
    IE 有children,FF没有;IE有parentElement,FF没有;IE有innerText,outerText,outerHTML,FF 没有;FF有HTMLElement,HTMLDivElement,XMLDocument,DocumentFragment,Node, Event,Element等等,IE没有;IE有数据岛,FF没有;IE跟FF创建HttpRequest实例的方法不一样。。等等。。
    4用脚本写去除字符串的前后空格

    String.prototype.trim = function(mode)
    {//前后去空格
    if (mode==’left’) {
    return ((this.charAt(0) == ” “ && this.length > 0) ? this.slice(1).trim(’left’) : this);
    } else
    if (mode == ’right’) {
    return ((this.charAt(this.length - 1) == ” “ && this.length > 0) ? this.slice(0, this.length - 1).trim(’right’) : this);
    } else {
    return this.trim(’left’).trim(’right’);
    }
    };

    5算出字符串中出现次数最多的字符是什么,出现了多少次

    <script type=”text/javascript”>
    //<![CDATA[var str ="adadfdfseffserfefsefseeffffftsdg"; //命名一个变量放置给出的字符串
    var maxLength = 0; //命名一个变量放置字母出现的最高次数并初始化为0
    var result = ''; //命名一个变量放置结果输入

    while( str != '' ){ //循环迭代开始,并判断字符串是否为空
    oldStr = str; //将原始的字符串变量赋值给新变量
    getStr = str.substr(0,1); //用字符串的substr的方法得到第一个字符(首字母)
    ev
    al("str = str.replace(/"+getStr+"/g,'')"); //详细如补充

    if( oldStr.length-str.length > maxLength )
    { //判断原始的字符串的长度减去替代后字符串长度是否大于之前出现的最大的字符串长度
    maxLength = oldStr.length-str.length; //两字符串长度相减得到最大的字符串长度
    result = getStr + "=" + maxLength //返回最大的字符串结果(字母、出现次数)
    }
    }

    alert(result) //弹出结果
    //]]>
    </script>

    6写出3中使用this的典型应用
    在HTML元素事件属性中inline方式使用this关键字:

    7.最后一个问题是,如何制作一个combo选项,就是可以输入可以下拉菜单选择。

    这个网上有很多成品,主要是通过绝对定位和相对定位结合的方式,改造原有的select 标签和input标签的方法。

    附上javascript正则表达式的基本知识:
    g: 全局匹配
    i: 忽略大小写
    ^ 匹配一个输入或一行的开头,/^a/匹配”an A”,而不匹配”An a”
    $ 匹配一个输入或一行的结尾,/a$/匹配”An a”,而不匹配”an A”
    * 匹配前面元字符0次或多次,/ba*/将匹配b,ba,baa,baaa
    + 匹配前面元字符1次或多次,/ba*/将匹配ba,baa,baaa
    ? 匹配前面元字符0次或1次,/ba*/将匹配b,ba
    (x) 匹配x保存x在名为$1…$9的变量中
    x|y 匹配x或y
    {n} 精确匹配n次
    {n,} 匹配n次以上
    {n,m} 匹配n-m次
    [xyz] 字符集(character set),匹配这个集合中的任一一个字符(或元字符)
    [^xyz] 不匹配这个集合中的任何一个字符
    [b] 匹配一个退格符
    b 匹配一个单词的边界
    B 匹配一个单词的非边界
    cX 这儿,X是一个控制符,/cM/匹配Ctrl-M
    d 匹配一个字数字符,/d/ = /[0-9]/
    D 匹配一个非字数字符,/D/ = /[^0-9]/
    n 匹配一个换行符
    r 匹配一个回车符
    s 匹配一个空白字符,包括n,r,f,t,v等
    S 匹配一个非空白字符,等于/[^nfrtv]/
    t 匹配一个制表符
    v 匹配一个重直制表符
    w 匹配一个可以组成单词的字符(alphanumeric,这是我的意译,含数字),包括下划线,如[w]匹配”$5.98″中的5,等于[a-zA- Z0-9]
    W 匹配一个不可以组成单词的字符,如[W]匹配”$5.98″中的$,等于[^a-zA-Z0-9
    举例:验证email
    var myReg = /^[_a-z0-9]+@([_a-z0-9]+.)+[a-z0-9]{2,3}$/;
    if(myReg.test(strEmail)) return true;

    为了您的安全,请只打开来源可靠的网址

    打开网站    取消

    来自: http://hi.baidu.com/shizhen12009/blog/item/b52efffdd8299248d7887d73.html
    展开全文
  • 随着各大互联网公司设立了Web前端开发工程师、设计工程师等职位,web前端越来越得到互联网企业的认可。而且其重视程度与地位也随着浏览器端的富客户端的体现而日益提高。 眼前对HTML5的未来和走向,业内的预测是会和...

     随着各大互联网公司设立了Web前端开发工程师、设计工程师等职位,web前端越来越得到互联网企业的认可。而且其重视程度与地位也随着浏览器端的富客户端的体现而日益提高。 眼前对HTML5的未来和走向,业内的预测是会和Flash、Silverlight等相结合,从而取代传统的客户端应用程序。而实现这个目标的客户端核心工作是有Web前端工程师来完成的。 从另一个角度,对于web产品来说,交互和用户体验是产品的第一价值,这部分价值的体现就是在web前端。可以说web前端是一个web产品的长相和谈吐、行为。

         下面就简单的说明一下web前端的组成部分。

     1.  UI设计部分

      这是web产品化的第一步。这个部分通常在稍大型的公司里,被单独设立为一个部门或者一些人来工作。主要是要掌握Photo, AI,可以很快的将创意转化为平面设计图,并制作PNG等小图片。 同时,UI设计还要预包含用户交互设计的元素,如何和用户交互的基本原型等。

    2. HTML/CSS,页面静态化

    这是web产品化的2步,就是将UI设计师的设计图切成静态页面。这里的“切”不是单纯的切,而是使用css里面背景色和边框样式等方式对设计原稿进行解读,并形成符合web标准的html代码。这里web前端还需要将图片、html页面以及css样式进行合理的文件分布安排等

     3.Javascript, AS 客户端动态化

    这是web产品化的3步,工程师使用DOM操作、AJAX,实现数据和服务端的通信以及本地样式的切换。同时,由于Javascript、AS是一门动态语言,所以这部分的编码要求web前端工程师有较好的编码习惯,能写高效率的OOP代码,并对代码进行压缩上线以降低带宽消耗等。

     4.Flash、Silverlight、Video   多媒体化

     这部分针对不同web产品有不同的要求,通常要求是可以使用Flash和web、Server进行交互,并对Flash进行设计与开发。

    5.PHP、Java等CGI, 服务端通信基本知识和编码

    这部分主要是更好的使用Ajax等技术,了解服务端的工作方式将更有利于web前端工程师工作的开展。通常优秀的web前端工程师都是对服务端的一种开发语言很了解。

    下面是webryan整理的百度web前端笔试和面试的一些题目和过程,提供给大家借鉴。

    百度web前端笔试试卷上的题目:

    1.判断字符串是否是这样组成的,第一个必须是字母,后面可以是字母、数字、下划线,总长度为5-20
    2.截取字符串abcdefg的efg
    3.让一个input的背景颜色变成红色
    4。给一个页面,写html css
    5。div的高宽等于浏览器可见区域的高宽,浏览器滚动,div始终覆盖浏览器的整个可见区域
    6。判断一个字符串中出现次数最多的字符,统计这个次数
    7。IE与FF脚本兼容性问题

    又重新问的是1,4,6,7,这次问出题者的意图,并且让给出7的更多答案,以及IE FF不兼容的原因
    然后看了看简历,没有问简历上的项目,而是让自己随便谈谈
    1对于web客户端技术未来趋势发展谈谈看法
    javascript + ajax=RIA
    Adobe Flash AS 3
    Flex
    Sliveright
    2web开发团队人员应该如何分工协作
    布局 CSS 脚本
    比如脚本人员长期的积累可能铸造类型YUI这样的产品级脚本库(亮点)
    3web开发曾经的团队有没有别人遇到问题,什么问题,向你请教
    4如果要实习,什么时候可以
    5自己在开发的过程中遇到什么问题,谈谈看法
    6web开发脚本开发环境用什么、调试用什么
    试过aptana,现在就用editplus
    调试肯定用firebug,ie下看页面DOM用IEInspector
    7如果有个新技术,现在需要掌握,你会怎么做
    新技术的发现我一般是通过RSS工具,比如我用GoogleReader
    每天有半个小时左右在看最新的资讯、技术走向
    发现新技术,首先有个大概了解,如果有深入的必要
    我一般会看他的官网,比如jquery,我会搜索到www.jquery.com,然后看Docs、samples
    如果要用到项目中,有困难的问题,我会svn得到最新的这个技术的源码,深入跟踪进去,看实现原理
    一般现在涌现的技术都是opensource

    提问时间
    1百度web开发脚本是否有做类似YUI库的打算
    2百度web开发工程师打算招多少人

    百度电话二面回忆 web开发部–web开发工程师

    首先是自我介绍
    然后谈谈做的web项目
    然后开始问技术问题

    前端开发的优化问题
    答:
    产品发布时,js的压缩,即函数名替换、整个文件压缩成一行
    css开发的时候 注释写清楚,先有个base.css,然后根据不同页面需要再加css,发布的时候将css中的一个定义写成一行,目的是压缩文件大小
    最终发布的时候甚至可以将css,js分别压缩成一个文件,甚至css、js通过技巧压缩到一个里边(亮点)
    这样的目的是,减少用户访问web产品的http连接数

    web前端产品的开发流程
    答:首先根据产品的定位、用户群,确定配色,然后纸上设计整体布局,然后png或者psd出效果图,切出需要的小图片,然后手写代码div+css构造出页面,然后根据功能写脚本
    参考126邮箱首页,将所有小图片放到一个图片中,通过css的background-position实现页面,还是为了优化,减少http连接数

    规避javascript多人开发函数重名问题
    答:首先是通过命名规范,比如根据不同的开发人员实现的功能,在函数名加前缀,虽然函数名看起来复杂,发布的时候还是可以替换,从而优化。
    还有一种办法是,每个开发人员都把自己的函数封装到类中,然后调用的时候即使函数名相同,但是因为是要类.函数名来调用,所以也减少了重复的可能性。

    javascript面向对象中继承实现
    答:我是用prototype.js extend.js扩展
    然后子类中parent.initialize()…
    答的不好
    正确答案:

     

    // 1. 构造器
    function Animal() {};
    function Mammal() {};
    function Canine() {};
    function Dog() {};
    // 2. 原型链表
    Mammal.prototype = new Animal();
    Canine.prototype = new Mammal();
    Dog.prototype = new Canine();

    prototype.js实现的基本原理
    答:
    将功能封装
    比如Ajax.Request,还是有判断浏览器的代码;Position这样的实现页面元素位置的计算

    prototye太大,如果一个页面功能不需要这样的,自己实现,怎么做
    答:首先页面、css、脚本分离之后,脚本中将整个模块功能写成一个类var Do={}
    其中初始化函数init:function(){},然后最后做Do.init()
    其中init会对页面上form中需要交互的元素绑定事件,比如$(‘input1′).οnclick=function(){}

    IE、FF下面脚本的区别
    答:
    1.IE有outerHTML,FF没有
    2.页面元素id,IE可以直接取,FF必须document.getElementById()
    3.Ajax里边FF是new XMLHttpRequest,而IE是
    try new ActiveXObject(‘Msxml2.XMLHTTP’) try new ActiveXObject(‘Microsoft.XMLHTTP’)

    FF下面实现outerHTML
    答:.parenet.firstChild .parent.innerHTML
    这个没答好
    正确答案:原理是,get:取到这个标签的tagname,然后属性循环构造成这个标签的属性
    set:把字符串用insertBefore插入到这个元素前面,然后removeChild这个元素

     

    <head>
    <SCRIPT LANGUAGE=”JavaScript”>
    <!–
    if(typeof(HTMLElement)!=”undefined” && !window.opera)
    {
    HTMLElement.prototype.__defineGetter__(“outerHTML”,function()
    {
    var a=this.attributes, str=”<”+this.tagName, i=0;
    for(;i<a.length;i++)
    if(a[i].specified)
    str+=” “+a[i].name+’=”‘+a[i].value+’”‘;
    if(!this.canHaveChildren)
    return str+” />”;
    return str+”>”+this.innerHTML+”</”+this.tagName+”>”;
    });
    HTMLElement.prototype.__defineSetter__(“outerHTML”,function(s)
    {
    var d = document.createElement(“DIV”); d.innerHTML = s;
    for(var i=0; i<d.childNodes.length; i++)
    this.parentNode.insertBefore(d.childNodes[i], this);
    this.parentNode.removeChild(this);
    });
    HTMLElement.prototype.__defineGetter__(“canHaveChildren”,function()
    {
    return !/^(area|base|basefont|col|frame|hr|img|br|input|isindex|link|meta|param)$/.test(this.tagName.toLowerCase());
    });
    }
    //–>
    </SCRIPT>

    IE、FF下面CSS的解释区别
    答:
    1.png透明背景,FF下面没有问题,IE需要用滤镜通道
    2.z-index在IE、FF下面的解释问题,

    IE会认为第一个z-index=0
    3.长字符串,word-wrap:break-all可以解决IE,但是FF需要overflow:hidden才行
    冯舒娅补充:
    1、有些标签在ff中不能用,比如button
    2、滤镜
    3、鼠标cursor:hand cursor:pointer
    4、div的高度自适应
    5、对box模型解析不一样
    6、ul、ol的padding和margin

    IE都能识别*,标准浏览器(如FF)不能识别*;
    IE6能识别*,但不能识别 !important;
    IE7能识别*,也能识别 !important;
    FF不能识别*,但能识别 !important;
    例如style=”*width:10px;!important width:20px;”
    这样在IE6下宽度为10px,在IE7下宽度时20px

    web前端技术的展望
    答:javascript ajax;flash AS;Flex;Sliveright
    附上网上的百度web开发工程师笔试问题集
    1编写一个方法 求一个字符串的字节长度

     

    <script language=”javascript” type=”text/javascript”>
    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);
    }(“hello你好,我好,大家好!world!”);
    </script>

    2编写一个方法 去掉一个数组的重复元素

     

    <script language=”javascript” type=”text/javascript”>
    Array.prototype.strip=function()
    {
    if(this.length<2) return [this[0]]||[];
    var arr=[];
    for(var i=0;i<this.length;i++)
    {
    arr.push(this.splice(i–,1));
    for(var j=0;j<this.length;j++)
    {
    if(this[j]==arr[arr.length-1])
    {
    this.splice(j–,1);
    }
    }
    }
    return arr;
    }
    var arr=["abc",85,"abc",85,8,8,1,2,5,4,7,8];
    alert(arr.strip());
    </script>

    3说出3条以上ff和ie的脚本兼容问题
    IE 有children,FF没有;IE有parentElement,FF没有;IE有innerText,outerText,outerHTML,FF 没有;FF有HTMLElement,HTMLDivElement,XMLDocument,DocumentFragment,Node, Event,Element等等,IE没有;IE有数据岛,FF没有;IE跟FF创建HttpRequest实例的方法不一样。。等等。。
    4用脚本写去除字符串的前后空格

     

    String.prototype.trim   =   function(mode)
    {//前后去空格
    if     (mode==’left’)   {
    return   ((this.charAt(0)   ==   ” “   &&   this.length   >   0)   ?   this.slice(1).trim(‘left’)   :   this);
    }   else
    if   (mode   ==   ’right’)   {
    return   ((this.charAt(this.length   -   1)   ==   ” “   &&   this.length   >   0)   ?   this.slice(0,   this.length   -   1).trim(‘right’)   :   this);
    }   else   {
    return   this.trim(‘left’).trim(‘right’);
    }
    };

    5算出字符串中出现次数最多的字符是什么,出现了多少次

     

    <script type=”text/javascript”>
    //<![CDATA[var str ="adadfdfseffserfefsefseeffffftsdg"; //命名一个变量放置给出的字符串
    var maxLength = 0; //命名一个变量放置字母出现的最高次数并初始化为0
    var result = ''; //命名一个变量放置结果输入

    while( str != '' ){ //循环迭代开始,并判断字符串是否为空
    oldStr = str; //将原始的字符串变量赋值给新变量
    getStr = str.substr(0,1); //用字符串的substr的方法得到第一个字符(首字母)
    eval("str = str.replace(/"+getStr+"/g,'')"); //详细如补充

    if( oldStr.length-str.length > maxLength )
    { //判断原始的字符串的长度减去替代后字符串长度是否大于之前出现的最大的字符串长度
    maxLength = oldStr.length-str.length; //两字符串长度相减得到最大的字符串长度
    result = getStr + "=" + maxLength //返回最大的字符串结果(字母、出现次数)
    }
    }

    alert(result) //弹出结果
    //]]>
    </script>

    6写出3中使用this的典型应用
    在HTML元素事件属性中inline方式使用this关键字:

    7.最后一个问题是,如何制作一个combo选项,就是可以输入可以下拉菜单选择。

    这个网上有很多成品,主要是通过绝对定位和相对定位结合的方式,改造原有的select 标签和input标签的方法。

     

    附上javascript正则表达式的基本知识:
    g: 全局匹配
    i: 忽略大小写
    ^ 匹配一个输入或一行的开头,/^a/匹配”an A”,而不匹配”An a”
    $ 匹配一个输入或一行的结尾,/a$/匹配”An a”,而不匹配”an A”
    * 匹配前面元字符0次或多次,/ba*/将匹配b,ba,baa,baaa
    + 匹配前面元字符1次或多次,/ba*/将匹配ba,baa,baaa
    ? 匹配前面元字符0次或1次,/ba*/将匹配b,ba
    (x) 匹配x保存x在名为$1…$9的变量中
    x|y 匹配x或y
    {n} 精确匹配n次
    {n,} 匹配n次以上
    {n,m} 匹配n-m次
    [xyz] 字符集(character set),匹配这个集合中的任一一个字符(或元字符)
    [^xyz] 不匹配这个集合中的任何一个字符
    [b] 匹配一个退格符
    b 匹配一个单词的边界
    B 匹配一个单词的非边界
    cX 这儿,X是一个控制符,/cM/匹配Ctrl-M
    d 匹配一个字数字符,/d/ = /[0-9]/
    D 匹配一个非字数字符,/D/ = /[^0-9]/
    n 匹配一个换行符
    r 匹配一个回车符
    s 匹配一个空白字符,包括n,r,f,t,v等
    S 匹配一个非空白字符,等于/[^nfrtv]/
    t 匹配一个制表符
    v 匹配一个重直制表符
    w 匹配一个可以组成单词的字符(alphanumeric,这是我的意译,含数字),包括下划线,如[w]匹配”$5.98″中的5,等于[a-zA-Z0-9]
    W 匹配一个不可以组成单词的字符,如[W]匹配”$5.98″中的$,等于[^a-zA-Z0-9
    举例:验证email
    var myReg = /^[_a-z0-9]+@([_a-z0-9]+.)+[a-z0-9]{2,3}$/;
    if(myReg.test(strEmail)) return true;

    展开全文
  • web前端笔试题-完善版

    千次阅读 多人点赞 2020-08-08 19:51:04
    web面试 1、定位有哪几种?分别简述其特点。 static:默认值,没有定位,元素出现在正常的文档流中 relative:生成相对定位的元素,不脱离文档流,相对于自身位置进行定位 absolute:生成绝对定位的元素,脱离文档...
  • web前端笔试题整合

    千次阅读 2018-12-13 16:19:48
    1.一个200 * 200的格在不同分辨率屏幕上下左右居中,用CSS实现 div{ width: 200px; height: 200px; background-color: red; position:absolute; top:50%; ...
  • 02web前端笔试题

    2018-10-16 21:12:00
    又参加了几场web前端的宣讲会,复习了一下,感觉有点用处吧,至少没有前几天一脸懵逼!希望接下来,越来越好,加油!!! 对啦,如果下面有错的地方,欢迎指出,谢谢~ 1、什么是跨域?跨域资源请求的方式有哪些? ...
  • 关于Web前端及百度web前端笔试面试题目 随着各大互联网公司设立了Web前端开发工程师、设计工程师等职位,web前端越来越得到互联网企业的认可。而且其重视程度与地位也随着浏览器 端的富客户端的体现而日益提高。 ...
  • 2019年最新web前端笔试题

    千次阅读 多人点赞 2019-03-19 19:13:42
    6.React性能优化,渲染20000多条checkbox组件,点击选择checkbox组件的时候特别卡,如何解决 import React, { Component } from 'react' import { Checkbox } from 'antd'   class App extends ...
  • 1.前端页面有哪三层构成,分别是什么?作用是什么?  1)、结构层:由 HTML 或 XHTML 之类的标记语言负责创建,仅负责语义的表达。解决了页面“内容是什么”的问题。  2)、表示层:由CSS负责创建,解决了页面...
  • web前端笔试题整理

    千次阅读 2013-04-19 12:03:19
    java 1, 判断字符串是否是这样组成的,第一个必须是字母,后面可以是字母、数字、下划线,总长度为5-20   1  var reg = /^[a-zA-Z][a-zA-Z_0-9]{4,19}$/; ...
  • web前端研发工程师笔试选择题带答案 web前端研发工程师笔试选择题带答案 web前端研发工程师笔试选择题带答案 1 要动态改变层中内容可以使用的方法有(AB ) a)innerHTML b)innerText c)通过设置层的隐藏与显示来...
  • 百度web前端笔试题

    千次阅读 2010-05-08 15:18:00
    百度web前端 2009.10.18笔试题,还有我的一些想法18号参加的笔试,一直没有消息,可悲。百度卷子上没说要保密,我在这儿发下我的一些我的想法应该没问题吧 : )1、 JavaScript包括哪些数据类型?我回答的是有两种...
  • 百度2014校园招聘---WEB前端开发笔试题目
  • 百度web前端笔试

    2010-10-20 15:51:58
    下面是webryan整理的百度web前端笔试和面试的一些题目和过程,提供给大家借鉴。 百度web前端笔试试卷上的题目: 1.判断字符串是否是这样组成的,第一个必须是字母,后面可以是字母、数字、下划线,总长度为5-20 2...
  • 本文总结了一些优质的前端面试(多数源于网络),初学者阅后也要用心钻研其中的原理,重要知识需要系统学习,透彻学习,形成自己的知识链。万不可投机取巧,只求面试过关是错误的! 面试有几点需注意: 1.面试...
  • web前端研发工程师笔试题(选择题带答案)
  • 随着各大互联网公司设立了Web前端开发工程师、设计工程师等职位,web前端越来越得到互联网企业的认可。而且其重视程度与地位也随着浏览器 端的富客户端的体现而日益提高。 眼前对HTML5的未来和走向,业内的预测是会...
  • 多益网络校招 —— web前端笔试题

    千次阅读 2020-11-20 23:16:05
    一、选择题 1、以下表达式哪一个可以产生0-7之间(含0,7)的随机数? A Math.ceil(Math.random()*7) B Math.floor(Math.random()*7) C Math.floor(Math.random()*8) D Math.ceil(Math.random()*8) /* Math.ceil是...
  • 2018WPS暑期实习生web前端笔试题昨天参加的现场笔试,总共六,现将题目整理如下:1.判断如下A,B,C各输出什么var arr = []; arr['a'] = a; console.log(arr.length) // A arr['2'] = 2; console.log(arr.length) /...
  • 感觉薪资10k下的都会出笔试题 特别高的薪资都是直接技术面试或者是 现场编程 总结很多人的面试,后期会对于单个知识点再说笔记详细讲解。 部分都是百度的答案,不是特全面的,可以自己找下 同时分享一个自己...
  • web前端笔试

    2014-03-27 20:22:11
    java 1, 判断字符串是否是这样组成的,第一个必须是字母,后面可以是字母、数字、下划线,总长度为5-20   1  var reg = /^[a-zA-Z][a-zA-Z_0-9]{4,19}$/; ...
  • Web前端笔试题 Html+css 1.对WEB标准以及w3c的理解与认识。 标签闭合,标签小写,不乱嵌套:提高搜索机器人的搜索几率; 使用外联的css和js,结构行为表现的分离:文件下载与页面加载速度更快,内容能被更...
  • web前端开发笔试题

    2012-10-21 23:01:47
    很齐全的ajax部分笔试题 Ajax的优缺点: 使用Ajax的最大优点,就是能在不更新整个页面的前提下维护数据。这使得 Web应用程序更为迅捷地回应用户动作,并避免了在网络上发送那些没有改 变过的信息。 对应用Ajax最主要...
  • web前端笔试试题(答案)

    万次阅读 多人点赞 2019-04-08 15:19:44
    一、填空(每空1分,共70分) 1、JS中的数据类型有哪些__string,number,undefined,null,boolean,Object Array,Function,;(3分) 2、JS中强制类型转换为number类型的方法有:parseInt()、parseFloat()、number()...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 5,644
精华内容 2,257
关键字:

web前端笔试选择题