前端面试题第一套

1.下列哪个样式定以后，内联（非块状）元素可以定义宽度和高度A.display：inlineB.display：noneC.display：blockD.display：inherit2.新窗口打开网页，用到以下那个值A._selfB._blankC._topD._parent3.下面有关js事件的响应，描述错误的是？A.click鼠标点击某个事件B.focus元素失去焦点C.load是某个页面的css js html 文档结构和图像被完成加载D.mousedown某个鼠标按键被按下4.元素的alt和title有什么异同，选出正确的说法A.alt和title同时设置的时候，alt作为图片的替代文字出现，title是图片的解释文字B.alt和title同时设置的时候，title作为图片的替代文字出现，alt是图片的解释文字C.以上说法都不正确5.下列js可以让input的背景颜色变成红色的是A.inputElement.style.backgroundColor = ‘red’;B.inputElement.backgroundColor = ‘red’;C.inputElement.style.backgroundColor = ‘#0000’;D.inputElement.background = ‘#0000’;6.下面有关html5标签说法错误的有A.标签定义声音，比如音乐或者其他音频流B.比如来自一个外部的新闻提供者的一篇新的文章，或者来自论坛的文本，亦或是来自其他外部源内容C.标签定义菜单列表。当希望列出表单控件时使用该标签D.标签定义命令按钮，比如单选按钮、复选框或者按钮7.下述有关css属性position的属性值的描述，说法错误的是A.static：没有定位，元素出现在正常的流中B.fixed：生成绝对定位的元素，相对于父元素进行定位C.relative：生成相对定位的元素，相对于元素本身正常位置进行定位D.absolute：生成绝对定位的元素，相对于static定位以外的第一个祖先元素进行定位8.下面符合一个有效的JavaScript变量定义规则的是A._$te$t2B.withC.a bcD.2a9.下面有关JavaScript中call( )和apply( )的描述，错误的是A.call与apply都属于function.prototype的一个方法，所以每个function实例都有call、apply属性B.两者传递的参数不同，call函数第一个参数都是要传入给当前对象的对象，apply不是C.apply传入的是一个参数数组，也就是将多个参数组合成为一个数组传入D.call传入的则是直接的参数列表。call方法可将一个函数的对象上下文从初始的上下文改变为由thisObj指定的新对象10.css属性overflow属性定义移除元素内容区的内容会如何处理。如果值为scroll，不论是否需要，用户代理都会提供一种滚动机制A.TrueB.False11.什么会被打印在控制台上？b是局部变量还是全局变量(function(){var a = b = 5;})()console.log(b);//5   全局12.执行这段代码，输出什么结果function test( ){console.log(a);console.log(foo());var a = 1;function foo(){return 2;}}test( );  13.执行这段代码，输出什么结果var fullname = 'John Doe';var obj = {      fullname: 'Colin Ihrig',       prop: {              fullname: 'Aurelio De Rosa',              getFullname: function() {                     return this.fullname;              }       }};console.log(obj.prop.getFullname()); // Aurelio De Rosavar test = obj.prop.getFullname; console.log(test()); // John Doe14.下面这个JS程序的输出是什么function Foo( ){var i = 0;return function( ){console.log(i++);}}var f1 = Foo( ),f2 = Foo( );f1( );//0f1( );//1f2( );//015.下面这个JS程序的输出是什么var bb = 1;function aa(bb){bb = 2;alert(bb);}aa(bb);alert(bb);16.Doctype作用？严格模式与混杂模式如何触发这两种模式，区分它们有何意义？17.CSS选择符有哪些？哪些属性可继承？优先级算法如何计算？CSS3新增伪类有哪些？18.谈谈this对象的理解//谁调用函数this就指向谁19.请用js实现全选和取消全选的功能，只需要写出js代码（可以使用jquery）全选
这是1这是2
20.面试官问你有没有男/女朋友

答案:

1. C。内联元素加上display：block;后被块级化。块级元素一般是其他元素的容器，可容纳内联元素和其他块状元素，块状元素排斥其他元素与其位于同一行，宽度(width)高度(height)起作用。因此，可以定义其宽度和高度。2. B。在html中通过<a>标签打开一个链接，通过 <a>标签的 target 属性规定在何处打开链接文档。如果在标签<a>中写入target属性，则浏览器会根据target的属性值去打开与其命名或名称相符的框架<frame>或者窗口。在target中还存在四个保留的属性值如下：3. B。onfocus获得焦点 onblur失去焦点4. A。这两个属性是有些重复了。在不同浏览器里面表现有些不同。在alt和title同时设置的时候，alt作为图片的替代文字出现，title是图片的解释文字。5. A。#0000是不正确的写法A写法是正确的，有两种写法：inputElement.style.backgroundColor = ‘red’;inputElement.style.backgroundColor = ‘#f00’;6. B。这里考察HTML标签的使用：<audio> 标签定义声音，比如音乐或其他音频流。 A正确。<canvas> 标签定义图形，比如图表和其他图像。<canvas> 标签只是图形容器，您必须使用脚本来绘制图形。 B错误，<article>标签定义外部的内容。比如来自一个外部的新闻提供者的一篇新的文章，或者来自 blog 的文本，或者是来自论坛的文本。亦或是来自其他外部源内容。<menu>标签定义命令的列表或菜单。<menu> 标签用于上下文菜单、工具栏以及用于列出表单控件和命令。 C正确command 元素表示用户能够调用的命令。<command> 标签可以定义命令按钮，比如单选按钮、复选框或按钮。只有当 command 元素位于 menu 元素内时，该元素才是可见的。否则不会显示这个元素，但是可以用它规定键盘快捷键。 D正确。7. B。static：元素框正常生成。会计元素生成一个矩形框，作为文档流的一部分，行内元素则会创建一个或多个行框，置于其父元素中。relative：元素框偏移某个距离。元素仍保持其未定位前的形状，它原本所占据的空间仍保留。absolute：元素框从文档流完全删除，并相对于其包含块定位。包含块可能是文档中的另一个元素或者是初始包含块。元素原先在正常文档流中所占的空间会关闭，就好像元素原来不存在一样。元素定位后生成一个快级框，而不论原来他在正常流中生成何种类型的框。fixed：元素框的表现类似于将position设置为absolute，不过其包含块是视窗本身8. A 。B：关键字，C：有空格，D：开头为数字第一个字符必须是一个ASCII字母，或一个下划线。注意第一个字符不能是数字。后续的字符必须是字母，数字或下划线。变量名称一定不能是保留字9. B。call（）方法和apply（）方法的作用相同，他们的区别在与接收参数的方式不同。对于call（），第一个参数是this值没有变化，变化的是其余参数都直接传递给参数（在使用call（）方法时，传递给函数的参数必须逐个列举出来。使用apply（）时，传递给函数的是参数数组）如下代码做出解释：    function add(c,d){    return this.a+this.b+c+d;        }        var o = {‘a’:1,’b’:3};        add.call(o,5,7);//1+3+5+7 = 16        add.apply(o,[10,20]);//1+3+10+20=3410. A。参数是scroll时候，必会出现滚动条。参数是auto时候，子元素内容大于父元素时出现滚动条。参数是visible时候，溢出的内容出现在父元素之外。参数是hidden时候，溢出隐藏。11. 5  b是全局变量---------------------------(5)12. undefined  2----------------------------------(5)13. Aurelio De Rosa  John Doe----------------(5)14.  0  1  0------------------------------------(5)15.  2  1-----------------------------------------(5)16. DOCTYPE作用？严格模式与混杂模式如何触发这两种模式，区分它们有何意义？(5)（1）声明位于文档中的最前面，处于标签之前。告知浏览器的解析器，用什么文档类型规范来解析这个文档。（2）严格模式的排版和JS运作模式是以该浏览器支持的最高标准运行（3）在混杂模式中，页面以宽松的向后兼容的方式显示。模拟老式浏览器的行为以防止站点无法工作。（4）DOCTYPE 不存在或格式不正确会导致文档以混杂模式呈现17.CSS选择符有哪些？那些属性可以继承？优先级算法如何计算？CSS3新增伪类有哪些？(15)*1.id选择器（#myid）2.类选择器（.myclassname）3.标签选择器（div,h1,p）4.相邻选择器（h1+p）5.子选择器（ul>li）6.后代选择器（li a）7.通配符选择器（*）8.属性选择器（a[rel=”external”]）9.伪类选择器（a：hover）*可继承：font-size font-family color*不可继承：border padding margin width height*优先级就近原则，样式定义最近者为准*载入样式以最后载入的定位为准；优先级为：!important > id > class > tagImportant比内联优先级高CSS3新增伪类举例：p：first-of-type 选择属于其父元素的首个
元素的每个
元素p：last-of-type 选择属于其父元素的最后
元素的每个
元素p：only-of-type 选择属于其父元素唯一的
元素的每个
元素p：only-child 选择属于其父元素的唯一子元素的每个
元素p：nth-child(2) 选择属于其父元素的第二个子元素的每个
元素：enabled、：disabled 控制表单控件的禁用状态：checked 单选框或复选框被选中18.谈谈对this对象的理解(10)this是js的一个关键字，随着函数使用场合不同，this的值会发生变化。但是总有一个原则，那就是this指的是调用函数的那个对象。This一般情况下：是全局对象Global。作为方法调用，那么this就是指这个对象。 19.全选，全不选 (10)$(function(){     $("#checkall").click(function(){            if($(this).attr("checked")){                    $("div.list input").attr("checked",true);   //全选            }else{                    $("div.list input").attr("checked",false);  //全不选            }     })})20.面试官问你是否有男女朋友(5)考虑到你工作的稳定性。几种情况：1）没有男女朋友，如果年纪比较大了，家里可能会有安排，如果是外地人，不太稳定；2）有男女朋友，在外地。异地恋很折磨人的，要么一方将就一方，要么分手，这对工作的稳定性有影响；3）有男女朋友且在本地，这种是面试官最喜欢见到的情况；4）考察的反应能力，是否诚实