zoukankan      html  css  js  c++  java
  • web前端面试题(一)

    1  选择题

    1.1   默认情况下,使用P标记会形成什么效果()

    A.在文字P所在位置中加入8个空格

    B.P后面的文字会变成粗体

    C.开始新的一行

    D.P后面的文字会变成斜体

    答案: C

    1.2   META元素的作用是什么()

    A.META元素用于表达HTML文档的格式

    B.META元素用于指定相关HTML文档的信息

    C.META元素用于实现本页的自动刷新

    D.以上都不对

    答案:B

    1.3   我们在HTML页面中制作了一个图像,想要在鼠标指向这个图像时浮出一条信息,应该使用哪个参数做()

    A.POP

    B.SRC

    C.ALT

    D.MSG

    答案:C

    1.4   使用以下哪一种元素可以将声音添加到网页里面()

    A.sound

    B.bgsound

    C.music

    D.voice

    答案:B

    1.5   以下HTML代码中,哪一个是将词语“Hello”显示为Verdana字体并且字号为5号的正确代码()

    A.<font size="5" font="Verdana">Hello</font>

    B.<font size="5" face="Verdana">Hello</font>

    C.<font size=5 face=Verdana>Hello</font>

    D.<font size=5 face="Verdana",text="Hello"</font>

    答案:B

    1.6   在<param>标签中,下列哪个属性用于给参数传递内容()

    A.Address

    B.Value

    C.Amount

    D.Method

    答案:B

    1.7   一个文件夹名称叫Parent,其下有一个叫做test.asp的文件,和一个名为Child的文件夹。Child下有一个名为default.htm文件,想在default.htm中作一个连接,链到test.asp。以下正确的是()

    A.<a href=“/test.asp”>…</a> 

    B.<a href=“c:/test.asp”>…</a>

    C.<a href=“‥/test.asp”>…</a> 

    D.<a href=“Parent/test.asp”>…</a>

    答案:C

    1.8   Window对象是代表InternetExplorer窗口的对象,其属性、方法和事件可以不经限定就可以直接使用。比如Window.Alert“stop”也可以直接写成:Alert“stop”这种说法是正确的还是错误的()

    A.正确

    B.错误

    答案:A

    1.9   语句A:HTML文档必须包括“头”和“主体”两部分 语句B:HTML文档的扩展名为.htm或.html以下说法正确的是:

    A.两句都对

    B.两句都错

    C.只有A对

    D.只有B对

    答案:D

    1.10   要将表格中的文字放在靠上居中的位置,应该怎么办(  )

    A.align="middle" align="top"          

    B.align="center" align="top" 

    C.valign="middle" align="top"         

    D.valign="top" align="center"

    答案:D

     1.11   下面语句表述正确的是()

    A. marginwidth=5表示框架宽度部分边缘所保留的空间。 

    B.marginwidth=5表示框架宽度空间 

    C.noresize是设定不用使用框框的大小

    D.noresize是使用者设定此参数后,可随意地拉动框架改变其大小。

    答案:A

    1.12   下列哪种CSS样式定义的方式拥有最高的优先级()

    A.  嵌入 

    B.  行内 

    C.  链接 

    D.  导入

    答案:B

    1.13web标准的制定者是()

    A.  微软

    B.  万维网联盟(W3C) 

    C.  网景公司(Netscape) 

    D.  SUN公司

    答案:B

    1.14   下列的HTML中哪个是最大的标题()

    A.  <h6> 

    B.  <head> 

    C.   <heading> 

    D.  <h1>

    答案:D

    1.15   请选择产生斜体字的HTML标签()

    A. <i> 

    B. <italics> 

    C. <ii> 

    D. <it>

    答案:A

    1.16   如何制作电子邮件链接()

    A.  <a href="xxx@yyy"> 

    B.  <mail href="xxx@yyy"> 

    C.  <a href="mailto:xxx@yyy">

    D.  <mail>xxx@yyy</mail>

    答案:C

    1.17   如何在新窗口打开链接()

    A.  <a href="url" new>

    B.  <a href="url" target="_blank"> 

    C.  <a href="url"target="new"> 

    D.  <a href="url" target="_parent">

    答案:B

    1.18   哪个HTML标签可用来定义内部样式表()

    A.  <style> 

    B.  <script>

    C. <css>

    答案:A

    1.19   下列哪个选项的CSS语法是正确的()

    A.  body:color=black 

    B.  {body:color=black(body} 

    C. body{color: black} 

    D. {body;color:black}

    答案:C

    1.20   如何在CSS文件中插入注释()

    A.  // this is a comment 

    B.  // this is a comment 

    C.  /*this is a comment */ 

    D.  ' this is a comment

    答案:C

    1.21   哪个CSS属性可控制文本的尺寸()

    A.  font-size 

    B.  text-style 

    C.  font-style 

    D.  text-size

    答案:A

    1.22   以下的CSS中,可使所有<p>元素变为粗体的正确语法是()

    A.  <p style="font-size:bold"> 

    B.  <p style="text-size:bold"> 

    C.  p{font-weight:bold} 

    D.  p {text-size:bold}

    答案:C

    1.23   如何显示没有下划线的超链接()

    A.  a{text-decoration:none} 

    B.  a {text-decoration:no underline} 

    C.  a {underline:none} 

    D.  a {decoration:no underline}

    答案:A

    1.24   定义JavaScript数组的正确方法是()

    A.  var txt = new Array="tim","kim","jim" 

    B.  var txt = newArray(1:"tim",2:"kim",3:"jim") 

    C.  vartxt = new Array("tim","kim","jim") 

    D.  var txt = newArray:1=("tim")2=("kim")3=("jim")

    答案:C

    1.25   打开名为“window2”的新窗口的JavaScript语法是()

    A.  open.new("http://www.w3schools.com","window2") 

    B.  window.open("http://www.w3schools.com","window2") 

    C.  new("http://www.w3schools.com","window2") 

    D.  new.window("http://www.w3schools.com","window2")

    答案:B

    1.26   在调试前的准备工作下列叙述不对的是()

    A.  在“设置”列表框中找到两个“禁用脚本调试”复选框,将它们前面的钩去掉 

    B.  如果“禁用脚本调试”复选框,前面的钩不去掉,则不会弹出调试信息 

    C.  “禁用脚本调试”复选框,前面的钩去掉后,当程序出错时会弹出调试信息 

    D.  “禁用脚本调试”复选框,前面的钩去不去与调试无关

    答案:D

    1.27   关于代码优化下列表述不对的是()

    A.  JavaScript程序代码编写出来后,主要是交给浏览器去运行 

    B.  尽可能使用全局变量,可以使代码简单

    C.  书写风格应遵循“标识符短而含义清晰”、“代码缩进对齐”、“尽可能注释”等原则 

    D.  在机器上运行的代码总是希望其速度越快越好,阅读维护时其可读性可理解性最好

    答案:B

    1.28   在HTML页面中,CSS样式的属性名为background-image对应的style对象的属性名是()

    A.background  

    B.backgroungImage  

    C.image

    答案:B

    1.29   HMTL表单的首要标记是<form>,<form>标记的参数method表示表单发送的方法,可能为get或post,下列关于get和post的描述正确的是()

    A.post方法传递的数据对客户端是不可见的

    B.get请求信息以查询字符串的形式发送,查询字符串长度没有大小限制 

    C.post方法对发送数据的数量限制在255个字符之内 

    D.get方法传递的数据对客户端是不可见的

    答案:A

    1.30   Javascript中制作图片代替按钮的提交效果需要手动提交方法submit(),以下调用正确的是()

    A.submit();                 

    B.myform.submit()

    C.document.myform.submit() 

    D.window.myform.submit();

    答案:C

    1.31   如果在HTML页面中包含如下图片标签,则选项中的()语句能够实现隐藏该图片的功能()

    A.document.getElementById(“pic”).style.display=”visible”;
    B.document.getElementById(“pic”).style.display=”disvisible”; 

    C.document.getElementById(“pic”).style.display=”block”; 

    D.document.getElementById(“pic”).style.display=”none”;

    答案:D

    1.32   在HTML页面上,当按下键盘上的任意一个键时都会触发Javascript的()事件

    A.onFocus   

    B.onBlur    

    C.onSubmit   

    D.onKeyDown

    答案:D

    1.33   下列JavaScript表达式当中,错误的是()

    A.var tempA, tempB, tempC 

    B.tempA *= 3

    C.tempA >= tempB || tempA <= tempC 

    D.tempA >= tempB >tempC

     答案:D

    1.34   在JavaScript中,以下代码能并闭一个窗口的是()

    A.window.exit() 

    B.window.shutdown() 

    C.window.end()  

    D.window.close()

    答案:D

    1.35   下列关于网页元素overflow的说法,正确的是 ()

    A.指网页元素的位置,距离左边框和上边框的距离 

    B.指网页元素的位置,距离右边框和下边框的距离 

    C.指网页元素的定位方式,可以取值中包括absolute 

    D.指网页元素的内容溢出时,是否显示多余的内容

    答案:D

    1.36   如果将想将两个层排列在同一行中,下列描述不能实现的是()

    A.直接插入两个DIV标记,会自动排在同一行

    B.指定DIV的position属性为absolute,然后将层位置拖放到同一行中 

    C.指定DIV标记的宽,并且指定其浮动方式,当层宽度之和小于外层元素 宽度时,会排在同一行

    D.使用一个表格,将两个层分别放入一行中的两个单元格内

    答案:A

    1.37   下列哪个是获得某时间对象的月份方法getMonth()的特点()

    A.获取的月份是从1开始计数的 

    B.获取的月份是从0开始计数的

    C.获取的月份是英文单词的缩写,如六月份为Jun 

    D.无法获取月份

    答案:B

    1.38   求一个表达式的值,可以使用的函数有 ()

    A.eval() 

    B.isNaN() 

    C.parseInt() 

    D.parseFloat() 

    E.return()

    答案:A

    1.39   以下代码能获得文档中的第一个form对象的是()

    A.document.forms[0];

    B.document.forms(0);

    C.document.forms.0;

    D.document.forms.item(0)

    答案:AD

    1.40   下列选项中,()段HTML代码所表示的“返回”链接能够正确实现IE工具栏中“后退”按钮的功能。

    A.<a href=”javascript:history.go(-1)”>返回</a>

    B.<ahref=”javascript:location.back()”>返回</a>

    C.<ahref=”javascript: location go(-1)”>返回</a>

    D.<a href=”javascript:history.back()”>返回</a>

    答案:AD

    2  问答题

    2.1    JavaScript中“==”和“===”有什么区别?

    ==进行判断的时候,如果类型不一致的,会自动转换类型进行判断。
    ===进行判断的时候,如果类型不一致,结果直接就是不相等。

     

    2.2  JavaScript中“this”在哪些场景下使用分别代表什么?

    答案摘自:浅析Javascript 中的 this 的七种使用场景

    情况一:全局 & 调用普通函数

    在全局环境中,this 永远指向 window。

    情况二:构造函数

    所谓的构造函数就是由一个函数 new 出来的对象,一般构造函数的函数名首字母大写,例如像 Object,Function,Array 这些都属于构造函数。

    情况三:对象方法

    如果函数作为对象的方法时,方法中的 this 指向该对象。

    注意:若是在对象方法中定义函数,那么情况就不同了。

    var obj = {
        x: 10,
        foo: function () {
            function f(){
                console.log(this);      //Window
                console.log(this.x);    //undefined
            }
            f();
        }
    }
    obj.foo();

    可以这么理解:函数 f 虽然是在 obj.foo 内部定义的,但它仍然属于一个普通函数,this 仍指向 window。

    在这里,如果想要调用上层作用域中的变量 obj.x,可以使用 self 缓存外部 this 变量。

    var obj = {
        x: 10,
        foo: function () {
            var self = this;
            function f(){
                console.log(self);      //{x: 10}
                console.log(self.x);    //10
            }
            f();
        }
    }
    obj.foo();

    如果 foo 函数不作为对象方法被调用:

    var obj = {
        x: 10,
        foo: function () {
            console.log(this);       //Window
            console.log(this.x);     //undefined
        }
    };
    var fn = obj.foo;
    fn();

    obj.foo 被赋值给一个全局变量,并没有作为 obj 的一个属性被调用,那么此时 this 的值是 window。

    情况四:构造函数 prototype 属性

    function Foo(){
        this.x = 10;
    }
    Foo.prototype.getX = function () {
        console.log(this);        //Foo {x: 10, getX: function}
        console.log(this.x);      //10
    }
    var foo = new Foo();
    foo.getX();

    在 Foo.prototype.getX 函数中,this 指向的 foo 对象。不仅仅如此,即便是在整个原型链中,this 代表的也是当前对象的值。

    情况五:函数用 call、apply或者 bind 调用。

    var obj = {
        x: 10
    }
    function foo(){
        console.log(this);     //{x: 10}
        console.log(this.x);   //10
    }
    foo.call(obj);
    foo.apply(obj);
    foo.bind(obj)();

    当一个函数被 call、apply 或者 bind 调用时,this 的值就取传入的对象的值。

    情况六:DOM event this

    在一个 HTML DOM 事件处理程序里,this 始终指向这个处理程序所绑定的 HTML DOM 节点:

    情况七:箭头函数中的 this

    当使用箭头函数的时候,情况就有所不同了:箭头函数内部的 this 是词法作用域,由上下文确定。

    2.3   了解或使用过哪些 JavaScript库或框架,它们分别有什么区别?

    库:jQuery、HighCharts、ECharts。

    echarts

    先大体了解一下echarts的历史:
    echarts是百度公司前端开发的一个图表库。
    支持柱状图、饼状图、k线图、map图、热导向图、折线图
    主要采用canvas画图。

    highchart

    highcharts是国外的一家公司开发的图表库,主要采用svg画图。
    支持的图表也很多,功能也比较强大。

    框架:vue.js、requirejs。

    2.4   JQuery对象和dom对象怎么相互切换?

     jQuery对象转成DOM对象:
    两种转换方式将一个jQuery对象转换成DOM对象:[index]和.get(index);
    (1)jQuery对象是一个数据对象,可以通过[index]的方法,来得到相应的DOM对象。
    如:var $v =$("#v") ; //jQuery对象
    var v=$v[0]; //DOM对象
    alert(v.checked) //检测这个checkbox是否被选中
    (2)jQuery本身提供,通过.get(index)方法,得到相应的DOM对象
    如:var $v=$("#v"); //jQuery对象
    var v=$v.get(0); //DOM对象
    alert(v.checked) //检测这个checkbox是否被选中

    DOM对象转成jQuery对象:
    对于已经是一个DOM对象,只需要用$()把DOM对象包装起来,就可以获得一个jQuery对象了。$(DOM对象)
    如:var v=document.getElementById("v"); //DOM对象
    var $v=$(v); //jQuery对象
    转换后,就可以任意使用jQuery的方法了。
    通过以上方法,可以任意的相互转换jQuery对象和DOM对象。需要再强调注意的是:DOM对象才能使用DOM中的方法,jQuery对象是不可以用DOM中的方法。

    2.5  form中“readonly”和“disabled”有什么区别?

    Readonly只针对input(text / password)和textarea有效,而disabled对于所有的表单元素都有效,包括select, radio, checkbox, button等。
    但是表单元素在使用了disabled后,当我们将表单以POST或GET的方式提交的话,这个元素的值不会被传递出去,而readonly会将该值传递出去(这种情况出现在我们将某个表单中的textarea元素设置为disabled或readonly,但是submit button却是可以使用的)。

    2.6   JavaScript怎么实现继承?

    原型链借用构造函数、组合继承、原型式继承、寄生组合继承(最佳方式)、原型式、寄生式。

    重新理解JS的6种继承方式

     

    2.7   ajax的优缺点

    ajax的优点
    Ajax的给开发者带来的好处大家基本上都深有体会,如下:
    1、最大的一点是页面无刷新,在页面内与服务器通信,给用户的体验非常好。
    2、使用异步方式与服务器通信,不需要打断用户的操作,具有更加迅速的响应能力。
    3、可以把以前一些服务器负担的工作转嫁到客户端,利用客户端闲置的能力来处理,减轻服务器和带宽的负担,节约空间和宽带租用成本。并且减轻服务器的负担,ajax的原则是“按需取数据”,可以最大程度的减少冗余请求,和响应对服务器造成的负担。
    4、基于标准化的并被广泛支持的技术,不需要下载插件或者小程序。
    ajax的缺点
    1、ajax干掉了back按钮,即对浏览器后退机制的破坏。后退按钮是一个标准的web站点的重要功能,但是它没法和js进行很好的合作。这是ajax所带来的一个比较严重的问题,因为用户往往是希望能够通过后退来取消前一次操作的。那么对于这个问题有没有办法?答案是肯定的,用过Gmail的知道,Gmail下面采用的ajax技术解决了这个问题,在Gmail下面是可以后退的,但是,它也并不能改变ajax的机制,它只是采用的一个比较笨但是有效的办法,即用户单击后退按钮访问历史记录时,通过创建或使用一个隐藏的IFRAME来重现页面上的变更。(例如,当用户在Google Maps中单击后退时,它在一个隐藏的IFRAME中进行搜索,然后将搜索结果反映到Ajax元素上,以便将应用程序状态恢复到当时的状态。)
    但是,虽然说这个问题是可以解决的,但是它所带来的开发成本是非常高的,和ajax框架所要求的快速开发是相背离的。这是ajax所带来的一个非常严重的问题。
    2、安全问题
    技术同时也对IT企业带来了新的安全威胁,ajax技术就如同对企业数据建立了一个直接通道。这使得开发者在不经意间会暴露比以前更多的数据和服务器逻辑。ajax的逻辑可以对客户端的安全扫描技术隐藏起来,允许黑客从远端服务器上建立新的攻击。还有ajax也难以避免一些已知的安全弱点,诸如跨站点脚步攻击、SQL注入攻击和基于credentials的安全漏洞等。
    3、对搜索引擎的支持比较弱。
    4、破坏了程序的异常机制。至少从目前看来,像ajax.dll,ajaxpro.dll这些ajax框架是会破坏程序的异常机制的。
    5、另外,像其他方面的一些问题,比如说违背了url和资源定位的初衷。例如,有一个url地址,如果采用了ajax技术,也许在该url地址下面看到的和别人在这个url地址下看到的内容是不同的。这个和资源定位的初衷是相背离的。
    6、一些手持设备(如手机、PDA等)现在还不能很好的支持ajax,如手机的浏览器上打开采用ajax技术的网站时,它目前是不支持的。

     

    2.8   曾经常使用的开发调试工具?

    常用的调试工具有Chrome浏览器的调试工具,火狐浏览器的Firebug插件调试工具,IE的开发人员工具

  • 相关阅读:
    零基础入门学习python--第一章
    mount: no medium found on /dev/sr0 找不到介质
    linux中shell变量$#,$@,$0,$1,$2的含义解释
    ospf多区域实例配置
    Linux查看cpu信息
    ethtool查看网卡以及修改网卡配置
    circusctl命令在ubuntu 上执行,卡住的现象处理。
    ubuntu 16.04.1 LTS zabbix-agent安装
    ubuntu 16.04.1 LTS 初始化
    Ubuntu开机启动的方式
  • 原文地址:https://www.cnblogs.com/yingzi1028/p/7712685.html
Copyright © 2011-2022 走看看