前端面试题--打卡day1

不知道你们混的什么圈 我混的黑眼圈

今天在牛客网上刷了一组题,易错分析
前端面试题--打卡day1_第1张图片
display属性 :

block : CSS 块对象的默认值。将对象强制作为块对象呈递,为对象之后添加新行 可以定义高度和宽度
none : CSS 隐藏对象。与 visibility 属性的hidden值不同,其不为被隐藏的对象保留其物理空间
inline : CSS 内联对象的默认值。将对象强制作为内联对象呈递,从对象中删除行
inherit 规定应该从父元素继承 display 属性的值。

前端面试题--打卡day1_第2张图片
参数是scroll时候,必会出现滚动条。
参数是auto时候,子元素内容大于父元素时出现滚动条。
参数是visible时候,溢出的内容出现在父元素之外。
参数是hidden时候,溢出隐藏。

前端面试题--打卡day1_第3张图片
在html中通过< a>标签打开一个链接,通过 < a> 标签的 target 属性规定在何处打开链接文档。
如果在标签< a>中写入target属性,则浏览器会根据target的属性值去打开与其命名或名称相符的 框架< frame>或者窗口.
在target中还存在四个保留的属性值如下,

_blank 在新窗口中打开被链接文档。
_self 默认。在相同的框架中打开被链接文档。
_parent 在父框架集中打开被链接文档。
_top 在整个窗口中打开被链接文档。
framename 在指定的框架中打开被链接文档。

这些 target 的所有 4 个值都以下划线开始。任何其他用一个下划线作为开头的窗口或者目标都会被浏览器忽略,因此,不要将下划线作为文档中定义的任何框架 name 或 id 的第一个字符。

前端面试题--打卡day1_第4张图片
此处个人认为题目不严谨,onclick是js事件,jq是click

onfocus 获得焦点 onblur 失去焦点

前端面试题--打卡day1_第5张图片
Flash提供了ExternalInterface接口与JavaScript通信,ExternalInterface有两个方法,call和addCallback,call的作用是让Flash调用js里的方法,addCallback是用来注册flash函数让js调用

前端面试题--打卡day1_第6张图片
alt是html标签的属性,而title既是html标签,又是html属性。
title标签这个不用多说,网页的标题就是写在这对标签之内的。
title作为属性时,用来为元素提供额外说明信息。例如,给超链接标签a添加了title属性,把鼠标移动到该链接上面是,就会显示title的内容,以达到补充说明或者提示的效果。
而alt属性则是用来指定替换文字,只能用在img、area和input元素中(包括applet元素),用于网页中图片无法正常显示时给用户提供文字说明使其了解图像信息。

前端面试题--打卡day1_第7张图片

#0000 是不正确的写法,至少要为六位,应该是#FF0000
A写法是正确的,有两种写法:
document.getElementById(“input”).style.backgroundColor = “red”;
inputElement.style.backgroundColor = “#FF0000”;

前端面试题--打卡day1_第8张图片

这里考察HTML标签的使用:
< audio> 标签定义声音,比如音乐或其他音频流。 A正确。
< canvas> 标签定义图形,比如图表和其他图像。< canvas> 标签只是图形容器,您必须使用脚本来绘制图形。 B错误,< article>标签定义外部的内容。比如来自一个外部的新闻提供者的一篇新的文章,或者来自 blog 的文本,或者是来自论坛的文本。亦或是来自其他外部源内容。
< menu> 标签定义命令的列表或菜单。< menu> 标签用于上下文菜单、工具栏以及用于列出表单控件和命令。 C正确
command 元素表示用户能够调用的命令。< command> 标签可以定义命令按钮,比如单选按钮、复选框或按钮。只有当 command 元素位于 menu 元素内时,该元素才是可见的。否则不会显示这个元素,但是可以用它规定键盘快捷键。 D正确。

前端面试题--打卡day1_第9张图片
CSS中Position属性有四个可选值,它们分别是:static、absolute、fixed、relative。

◆position:static 无定位
该属性值是所有元素定位的默认情况,在一般情况下,我们不需要特别的去声明它,但有时候遇到继承的情况,我们不愿意见到元素所继承的属性影响本身,从而可以用position:static取消继承,即还原元素定位的默认值。
◆position:absolute 绝对定位
使用position:absolute,能够很准确的将元素移动到你想要的位置,
◆position:fixed 相对于窗口的固定定位
这个定位属性值是什么意思呢?元素的定位方式同absolute类似,但它的包含块是视区本身。在屏幕媒体如WEB浏览器中,元素在文档滚动时不会在浏览器视察中移动。例如,它允许框架样式布局。在页式媒体如打印输出中,一个固定元素会出现于第一页的相同位置。这一点可用于生成流动标题或脚注。我们也见过相似的效果,但大都数效果不是通过CSS来实现了,而是应用了JS脚本。
请特别注意,IE6不支持CSS中的position:fixed属性。真的非常遗憾,要不然我们就可以试试这种酷酷的效果了。
◆position:relative 相对定位
所谓相对定位到底是什么意思呢,是基于哪里的相对呢?我们需要明确一个概念,相对定位是相对于元素默认的位置的定位。既然是相对的,我们就需要设置不同的值来声明定位在哪里,top、bottom、left、right四个数值配合,来明确元素的位置。

前端面试题--打卡day1_第10张图片

完全一致的意思是,域名要相同(www.example.com和example.com不同),协议要相同(http和https不同),端口号要相同(默认是:80端口,它和:8080就不同)。有的浏览器口子松一点,允许端口不同,大多数浏览器都会严格遵守这个限制。
详情:廖雪峰的教程

前端面试题--打卡day1_第11张图片在这里插入图片描述
首先返回的function函数赋值给全局变量f1,因此function函数就被储存在了内存中,因为foo函数是function函数的父函数,于是foo函数和局部变量i也被存在了内存。之后f1()被调用了两次,第一次调用时i=0,因为是i++,先输出i的值0,然后再++;第二次调用是i=1,所以先输出1;而f2是一个新的变量,因此i的值初始化为0。

前端面试题--打卡day1_第12张图片在这里插入图片描述
函数体内,bb并没有使用var来定义,按理说这个bb在预处理的时候应该是window的属性。但在这里,函数声明的时候,带了一个参数bb,也就是相当于在函数体内声明了var bb。所以,函数里的bb就是函数活动对象的属性。所以函数执行时会输出2。函数执行完后,函数的活动对象被销毁,也就是局部的这个bb被删除了,执行流进入到window,再输出bb,值就是1了。

前端面试题--打卡day1_第13张图片
A正确;
B是关键字;
C有空格;
D开头为数字;
第一个字符必须是一个 ASCII 字母(大小写均可),或一个下划线(_)。注意第一个字符不能是数字。
后续的字符必须是字母、数字或下划线。
变量名称一定不能是 保留字。

前端面试题--打卡day1_第14张图片
此题选B

NaN,即非数值(Not a Number)是一个特殊的数值,这个数值用来表示一个本来要返回数值的操作数未返回数值的情况(这样就不会抛出错误了)。

针对NaN的特点,ECMAScript定义了isNaN()函数。这个函数接受一个参数,该参数可以是任何类型,而函数会帮我们确定这个参数是否“不是数值”。isNaN()在接受一个值后,会尝试将这个值转换为数值。某些不是数值的值会直接转换为数值,例如字符串“10”或Boolean值。而任何不能被转换为数值的值都会导致这个函数返回true。

前端面试题--打卡day1_第15张图片

常见事件:
1. 点击事件:
1. onclick:单击事件
2. ondblclick:双击事件
2. 焦点事件
1. onblur:失去焦点
2. onfocus:元素获得焦点。
3. 加载事件:
1. onload:一张页面或一幅图像完成加载。
4. 鼠标事件:
1. onmousedown 鼠标按钮被按下。
2. onmouseup 鼠标按键被松开。
3. onmousemove 鼠标被移动。
4. onmouseover 鼠标移到某元素之上。
5. onmouseout 鼠标从某元素移开。
5. 键盘事件:
1. onkeydown 某个键盘按键被按下。
2. onkeyup 某个键盘按键被松开。
3. onkeypress 某个键盘按键被按下并松开。
6. 选择和改变
1. onchange 域的内容被改变。
2. onselect 文本被选中。
7. 表单事件:
1. onsubmit 确认按钮被点击。
2. onreset 重置按钮被点击。

前端面试题--打卡day1_第16张图片
1. 声明位于文档中的最前面,处于 标签之前。告知浏览器的解析器,用什么文档类型 规范来解析这个文档。
2.严格模式的排版和 JS 运作模式是 以该浏览器支持的最高标准运行。在混杂模式中,页面以宽松的向后兼容的方式显示。模拟老式浏览器的行为以防止站点无法工作。
3.DOCTYPE不存在或格式不正确会导致文档以混杂模式呈现。

前端面试题--打卡day1_第17张图片
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 = 34

前端面试题--打卡day1_第18张图片
C,D
C:当定义border:none时,表示无边框样式,浏览器并不会对边框进行渲染,也就没有实际的宽度;
D:定义边框时,除了设置宽度外,还必须设置边框的样式才能显示出来。

前端面试题--打卡day1_第19张图片
CSS Sprites在国内很多人叫css精灵,是一种网页图片应用处理方式。它允许你将一个页面涉及到的所有零星图片都包含到一张大图中去,这样一来,当访问该页面时,载入的图片就不会像以前那样一幅一幅地慢慢显示出来了。
利用CSS的“background-image”,“background- repeat”,“background-position”的组合进行背景定位,background-position可以用数字精确的定位出背景图片的位置。
利用CSS Sprites能很好地减少网页的http请求,从而大大的提高页面的性能,这也是CSS Sprites最大的优点,也是其被广泛传播和应用的主要原因;
CSS Sprites能减少图片的字节,曾经比较过多次3张图片合并成1张图片的字节总是小于这3张图片的字节总和。所以C错误
解决了网页设计师在图片命名上的困扰,只需对一张集合的图片上命名就可以了,不需要对每一个小元素进行命名,从而提高了网页的制作效率。
更换风格方便,只需要在一张或少张图片上修改图片的颜色或样式,整个网页的风格就可以改变。维护起来更加方便。

前端面试题--打卡day1_第20张图片
Wekbit是一个开源的Web浏览器引擎,也就是浏览器的内核。Apple的Safari, Google的Chrome, Nokia S60平台的默认浏览器,Apple手机的默认浏览器,Android手机的默认浏览器均采用的Webkit作为器浏览器内核。Webkit的采用程度由 此可见一斑,理所当然的成为了当今主流的三大浏览器内核之一。另外两个分别是Gecko和Trident,大名鼎鼎的Firefox便是使用的Gecko 内核,而微软的IE系列则使用的是Trident内核。
另外,搜狗浏览器是双核的,双核并不是指一个页面由2个内核同时处理,而是所有网页(通常是标准通用标记语言的应用超文本标记语言)由webkit内核处理,只有银行网站用IE内核

晚睡的女孩是会被月亮抓取罚站的,那不睡的女孩可以做月亮吗?

你可能感兴趣的:(前端面试题)