display: hidden; 不为被隐藏的对象保留其物理空间visibility: hidden；与 display: none; 两者没有本质上的区别visibility: hidden；所占据的空间位置仍然存在，仅为视觉上的完全透明；visibility: hidden；产生回流与重绘

答案3

下面属于CSS3新增属性的有？

box-shadowtext-shadowborder-radius全部都是

答案4

关于position定位，下列说法错误的是？

fixed元素，可定位与相对浏览器窗口的指定坐标，它始终是以body为依据absolute元素，如果它的父容器设置了position属性，并且属性值为absolute或relative，那么就会一句父容器进行偏移relative元素以它原来的位置为基准偏移，在其移动后，原来的位置不再占据空间fixed属性的元素在标准流中不占位置

答案3

CSS盒子模型中（）是透明的，这部分可以显示背景？

marginbordercontentpadding

答案4

CSS样式，边距：10px 20px 40px 30px; 哪一个是底边距？

20px40px30px10px

答案2

CSS中下面哪个属性是不可继承的？

font-familycolorborderfont-size

答案3

下列哪个不是浏览器支持的锚伪类？

a:hovera:disableda:linka:active

答案2

关于CSS选择器，以下说法正确的是？

每条选择器最多只能出现1个伪类:nth-child(an+b)中n的值从0开始每条选择器最多只能出现2个伪元素A+B匹配A之后所有符合B规则的元素

答案2

关于浮动元素，下面说法错误的是？

行内元素与浮动元素发生重叠，其边框，背景和内容都会显示在浮动元素之下如果有非浮动元素和浮动元素同时存在，并且非浮动元素在前，则浮动元素不会高于非浮动元素如果有多个浮动元素，浮动元素会按顺序排下来而不会发生重叠的现象浮动元素会尽可能地向顶端对齐、向左或向右对齐

答案1

下列哪个不属于id与class之间的区别？

在class中可以定义:hover伪类，在id中不能定义id与class具有更高的样式优先级一个元素只能有一个id属性值，却可以拥有多个class属性值id在文档中只能使用一次，而class可以多次使用

答案1

在鼠标移到按钮并点击时，会产生一串什么样的事件？

hover active focusfocus hover activehover focus activeactive hover focus

答案3

CSS 的英文单词全称是什么？

Colorful Style SheetCreative Style SheetCascading Style SheetComputer Style Sheet

答案3

以下全部属于块级标签的是？

div/p/input/span/imgdiv/p/form/ul/lidiv/h1/p/img/dlspan/h1/p/img/dl

答案2

关于行内元素不正确的是？

divimgsapnselect

答案1

下述有关css属性position的属性值的描述，说法错误的是？

static 没有定位，元素出现在正常的文档流中relative 生成相对定位的元素，相对于元素自身正常位置进行定位absolute 生成绝对定位，相对于 static 定位以外的第一个祖先元素进行定位fixed 生成绝对定位，相对于父元素进行定位

答案4

CSS样式，下面哪一个能够用于边距的单位？

pxptem全都可以

答案4

CSS（二）

下列不是 CSS3 新特性的是？

@keyframesfont-size@mediaflex

答案2

使用什么可以实现 CSS3 动画效果？

transformkeyframestransitionrotate3d

答案2

实现翻书效果可以使用 CSS3 的什么方法？

rotateYtranslateYscaleYperspective(n)

答案1

下面哪个选择器不是 CSS3 才定义的？

:enabled:only-child:before:checked

答案3

下列选项中不属于 CSS3 样式选择器的是？

root 选择器id 选择器target 选择器empty 选择器

答案2

CSS3 中什么功能可以实现文字或图像的变形处理？

deformscalerotatetransform

答案4

以下是 CSS3 支持的单位有？

vwem%全部都是

答案4

下面属于 CSS3 新增属性的有？

box-shadowtext-shadowborder-radius全部都是

答案4

在 CSS3 中，以下哪个是IE浏览器（Trident内核）的私有属性前缀？

-trident-ms-ie-webkit

答案2

下列 CSS3 新特性在移动端兼容性较好，我们可以在工作中使用的是？

字体大小或尺寸单位使用remCSS Grid LayoutPosition: stickyCSS.supports() API

答案1

first-of-type 和 first-child 的区别不正确的是？

first-of-type 匹配的元素的范围都属于同一级first-of-type 匹配的是该类型的第一个元素，不限制是第一个子元素first-of-type 匹配的是该类型的第一个元素，必须是第一个子元素first-child 是结构上的第一个子元素

答案3

有两个上下相邻的div，它们的样式如下，请问它们的上下间隔是？

.div1 {

width: 100px;

height: 100px;

margin-bottom: 30px;

}

.div2 {

width: 100px;

height: 100px;

margin-top: 20px;

}

10px50px30px20px

答案3

超链接被点击访问后，hover和active将不再起作用，下列哪种 CSS 属性的排列顺序能解决这个问题？

H-L-V-AL-V-H-AL-A-H-VA-L-H-V

答案2

以下不是 box-sizing 的属性的是？

content-boxinheritautoborder-box

答案3

关于 CSS3 动画不正确的是？

代码相对简单在动画控制上不够灵活兼容性不好动画功能都可以实现

答案4

以下哪个是 animation 的属性？

animation-nameanimation-durationanimatioin-timing-function全部都是

答案4

关于媒介查询的使用方法正确的是？

@media 媒体类型 and (媒体特性) { 样式规则 }通常在移动端使用为了适配多屏幕，使用 rem 单位全部正确

答案1

如果要将一个元素旋转90度，可以使用 CSS 中的哪个属性实现？

translatetransitionanimationtransform

答案4

CSS（三）

下列哪个不是 CSS 预编译工具？

sassbassslessstylus

答案2

下列关于 Canvas 和 SVG 图形的区别说法正确的是？

Canvas 绘制的形状都能被记忆和操作Canvas 不能使用绘制对象的相关事件处理，因为我们没有他们的参考SVG 为了之后的操作，需要记录坐标，所以比较快速Canvas 和分辨率无关

答案2

下述有关 border:none 和 border:0 的区别，描述错误的是？

border:none 表示边框样式无当定义边框时，仅设置边框宽度不可以达到显示的效果当定义了 border:node，即隐藏了边框的显示，实际就是边框宽度为0border:0 表示边框宽度为0

答案3

Canvas 匀速属性和用 CSS 设置宽高的区别错误的是？

绘图都是在画布上进行的CSS 控制的是画布的尺寸CSS 控制的是容器的尺寸画布默认宽为300px，高为150px

答案2

下面关于sass/scss和less的说法正确的是？

less和sass都是CSS预编译器，对CSS赋予了动态语言的特性sass的安装不需要Ruby环境，是在服务器端处理的，而less是需要引入less.js来处理less代码输出css到浏览器less和sass的变量符号都是$less和sass都支持条件语句，可以使用if/else、for循环等。

答案1

关于 scss 正确的是？

scss 可以将 CSS 当做函数编写可以定义变量、可以嵌套定义scss 是 Sass语言中的一套语法扩展名全部都是

答案

关于 Sass 和 Less 的区别不正确的是？

编译环境不一样输出配置不同变量名可以一样插值语法不同

答案2

关于 Sass 说法正确的是？

需要安装 Ruby 环境，在服务端处理Sass 的继承相当于 Less 的混合Sass 的变量名使用 $全部正确

答案2

以下不属于 Sass 提供输出项的是？

compactcompressednested没有输出项

答案4

关于 Sass 输出项正确的是？

expanded 选项用于多行 CSS 代码compact 选项显示简洁格式的 CSS 代码nested 选型用于嵌套缩紧的 CSS 代码全部正确

答案4

关于预处理器下列说法正确的是？

增强了 CSS 代码的复用性具有很方便的 UI 模块化开发能力能极大地提高工作效率全部正确

答案4

关于 Sass 与 Scss 的区别不正确的是？

Scss 包含了 Sass 的特色功能Scss 支持所有 CSS3 语法Scss 是新语法，Sass 是旧语法Sass 语法用分号分隔语句

答案4

哪个处理器可以进行如下运算？

body {

margin: (14px/2);

top: 50px + 100px;

right: 80 * 10%;

}

Lessstylussass都可以

答案4

属于 Stylus 颜色处理函数的是？

complement($color)darken(color, 10%)spin(@color, 10)darken(@color, 10%)

答案2

下列代码使用了哪个预处理器的颜色处理函数？

$color: #0982c1;

h1 {

background: $color;

border: 3px solid darken($color, 50%)

}

LessStylusSass都不是

答案3

关于 Mixins 说法正确的是？

Mixins 可以将一部分样式抽出，作为单独定义的模块，被很多选择器重复使用Sass 样式中声明 Mixins 时需要使用“@mixin”,然后后面紧跟 Mixins 的名在 Less 中，混入是指将定义好的“ClassA”引入到另一个已经定义的“ClassB”中全部正确

答案4

下列代码是哪个预处理器的 Mixins？

/* 声明一个Mixin叫做error */

error(borderWidth = 2px) {

border: borderWidth solid #000;

color: #f00;

}

/* 调用error */

.generic-error {

error(); /*直接调用*/

}

.login-error {

error(5px); /*传递参数*/

}

stylussassless都不是

答案1

以下属于 Sass 上的运算符的是？

字符串运算符布尔运算法列表运算符全部都是

答案4

关于预处理器的继承说法不正确的是？

Sass 和 Stylus 的继承是把一个选择器的所有样式继承到另一个选择器上CSS 预处理器语言不可以从一个选择器继承另一个选择器下的所有样式Sass 和 Stylus 在继承另一个选择器的样式时需要使用"@extend"开始Less 支持的继承和 Sass 与 Stylus 不一样，它不是在选择器上继承，而是将Mixins 中的样式嵌套到每个选择器里。

答案2

关于 Less 的条件语句不正确的是？

条件语句是常见的关键词if和else if之类其实现方式是利用关键词“when”Less 的条件语句提供了很多类型检查函数来辅助表达式，例如iscolor、isnumber、isstring、iskeyword、isurl等Less 的条件表达式同样支持 AND 和 OR 以及 NOT 来组合条件表达式

答案1

关于循环语句不正确的是？

Sass 中使用 for 循环语句需要“@for”，并且配合“from”和“through”一起使用Less 支持 for 循环语法Sass 和 Stylus 还支持 for 循环语句在 Less 中可以使用 When 来模拟出 for 循环的特性

答案2

JavaScript（一）

[“1”, “2”, “3”].map(parseInt)的返回值是什么？

[“1”, “2”, “3”][1, NaN, NaN][1, 2, 3][0, 1, 2]

答案2

JavaScript 中 window 对象的子对象不包含以下哪个对象？

selfhistorymessagedocument

答案3

以下代码的输出结果是：

function showCase(value) {

switch(value) {

case 'A':

console.log('Case A');

break;

case 'B':

console.log('Case B');

break;

case undefined:

console.log('undefined');

break;

default:

console.log('Do not know')

}

}

showCase(new String('A'))

Case BCase ADo not knowundefined

答案3

下面代码的输出结果是？

var two = 0.2

var one = 0.1

var eight = 0.8

var six = 0.6

console.log([two - one === one, eight - six === two])

[true, false][false, false][true, true]other

答案1

下面代码的执行结果是什么？

var string = "string";

var number = 0;

var bool = true;

console.log(number || string);

console.log(number && string);

console.log(bool || number);

console.log(bool && number);

“string”, “string”, true, 0“string”, 0, true, true“string”, 0 true, 0“string”, true, 0, 0

答案3

[typeof null, null instanceof Object] 的结果是什么？

[“object”, false][null, false][“object”, true]other

答案1

下面代码的输入结果是？

var val = "smtg";

console.log('Value is' + (val === 'smtg') ? 'Something' : 'Nothing')

Value is NothingNaNValue is Somethingother

答案4

下面代码的输出结果是什么？

var name = "World!";

(function() {

if (typeof name === "undefined") {

var name = "Jack";

console.log("Goodbye " + name)

} else {

console.log("Hello "+ name);

}

})();

Hello undefinedHello WorldGoodbye JackHello Jack

答案3

var arr = []; typeof arr 的结果是？

functionarrayundefinedobject

答案4

以下代码执行后，console.log的输出是？

function Foo() {

console.log(this.location);

}

Foo();

当前窗口的 Location 对象nullundefinedTypeError

答案1

如何遍历下面的 my_data 对象？

var my_data = {

a: "Apple",

b: "Banana",

c: "Mango"

}

foreach(my_data as key => value){}for(var i=0;i<my_data.length;i++){}for(var key in my_data){}全都不是

答案3

如何判断一个JS对象是否是Array，arr为要判断的对象，其中最准确的方法是？

Object.prototype.toString.call(arr) === “[object Array]”arr.toString === “[object Array]”arr instanceof Arraytypeof(arr)

答案1

下列代码 hasOwnProperty 的作用是？

var obj = { }

...

obj.hasOwnProperty(val)

判断 obj 对象是否具有 val 的值判断 obj 的原型对象是否具有 val 的属性判断 obj 的原型对象是否具有 val 的值判断 obj 对象是否具有 val 属性

答案4

下列不属于 JS 内置对象的是？

RegExpDateErrorWindow

答案4

JS中的数字在计算机内存存储为多少Byte？

16Byte8Byte2Byte4Byte

答案2

以下代码的运行结果是什么？

for(var i = 0; i < 10; i++) {

setTimeout(()=> {

console.log(i)

},1000)

}

10个100至910个9无限循环

答案1

下拉菜单中，用户更改表单元素 Select 中的值时，就会调用（）事件：

onChangeonClickonFocusonMouseOver

答案1

语句 var arr = [a,b,c,d]; 执行后，数组中arr中每项都是一个整数，下面得到其中最大整数语句不正确的是？

Math.max.call(Math, arr[0], arr[1], arr[2], arr[3])Math.max.apply(Math, arr)Math.max(arr)Marh.max(arr[0], arr[1], arr[2], arr[3])

答案3

JS 实现继承的方式，不正确的是？

关联继承原型链继承构造函数继承组合继承

答案1

以下代码执行后，输出结果是？

let x = 10;

let foo = () => {

console.log(x);

let x = 20;

x++;

}

foo();

21抛出 ReferenceError1020

答案2

关于 this 的工作原理，下面 4 种情况的描述错误的是？

在全局范围内， this指向全局对象（浏览器下指window）对象函数调用时，this指向当前对象使用new实例化对象时，this指向新创建的对象全局函数调用时，this指向全局函数

答案4

以下JS操作数组的方法中不能添加元素的是？

poppushunshiftsplice

答案1

关于JS，以下选项描述错误的是？

通过 hasOwnProperty 可判断一个对象以及其原型链上是否具有指定名称的属性在原型上扩展的可枚举方法，会被for in循环出来使用 object.defineProperty 可向对象添加或修改属性原型链是JS实现继承的一种模型

答案1

JS数组的方法中，哪些不能改变数组自身？

concatsplicesortpop

答案1

下面有关 JS 中 call 和 apply 的描述错误的是？

apply传入的是一个参数数组，也就是将多个参数组合成为一个数组传入call与apply都属于Function.prototype的一个方法，所以每个function实例都有call、apply属性两者传递的参数不同，call函数第一个参数都是要传入给当前对象的对象，apply不是call传入的则是直接的参数列表。call方法可将一个函数的对象上下文从初始的上下文改变为由 thisObj 指定的新对象

答案3

白屏时间 first paint 和可交互时间 dom ready的关系是？

先触发 dom ready，后触发 first paint一起触发没关系先触发fisrt paint，后触发 dom ready

答案4

最后一句alert的输入结果是？

var msg = "hello";

for(var i = 0; i < 10; i++) {

var msg = 'hello' + i * 2 + i;

}

alert(msg);

hello27hello30hello189hello

答案3

要在10秒后调用checkState，下列哪个是正确的？

window.setTimeout(checkState(), 10)window.setTimeout(checkState, 10)window.setTimeout(checkState(), 10000)window.setTimeout(checkState, 10000)

答案4

下列代码的执行结果是？

console.log(([]) ? true : false);

console.log(([] == false ? true : false));

console.log(({ } == false)? true : false);

true true falsefalse true truetrue false truetrue true true

答案1

JavaScript（二）

JS 定义 var a = “40”; var b = 7; 则执行 a % b会得到：

“5”5undefinednull

答案5

下列关于闭包描述正确的是？

闭包不耗内存，可以随意使用闭包内变量执行后会被清除闭包不满足链式作用域结构(function(){})()理论上是一个闭包

答案4

下面有关浏览器中使用JS跨域获取数据的描述，说法错误的是？

域名、端口相同，协议不同，属于相同的域使用 window.name 来进行跨域JS 可以使用JSONP进行跨域通过修改 document.domain 来跨子域

答案1

下面运行结果正确的是？

var a = { }, b = Object.prototype;

console.log([a.prototype === b, Object.getPrototypeOf(a) === b]);

[false, false][false, true]other[true, true]

答案2

下面代码的运行结果是？

var a = /678/, b = /678/;

console.log(a == b, a === b);

false、falsetrue、falsetrue、trueother

答案1

匹配页面中输入的字符串，范围需要是[0.5, 500]，小数位后最多保留两位，以下正则表达式不能实现该需求的是？

下面有关值类型和引用类型描述不正确的是？

值类型变量的作用域主要实在栈上分配内存空间内，而引用类型变量作用域主要在分配的堆上。值类型数据是在栈上分配内存空间，使用效率相对较高。而引用类型数据是分配在堆上，引用类型的变量通常包含一个指向实例的指针，变量通过指针来引用。引用类型一般都具有继承性，但是值类型一般都是封装的，因此值类型不能作为其他类型的基类。值类型的变量赋值只是进行数据复制，创建一个同值的新对象，而引用类型变量赋值，仅仅是把对象的引用的指针赋值给变量，使它们共用一个内存地址。

答案1

以下JS代码输入的结果是？

var a = "5" + 3;

var b = "5" - 3;

console.log(a, b);

4405error53, 2都不对

答案3

DOM（文件对象模型）提供了树状结构的表示方法，以下描述正确的是？

不是所有的HTML elements 都是 element nodesDocument 不是一个 document node，是一种节点格式在 HTML element 内的 text 内容也是 text node所有 comments 都是 document node

答案3

DOM 事件流不包括哪个阶段？

事件捕获阶段处于目标阶段事件冒泡阶段事件监控阶段

答案4

下列哪项不能提高dom元素操作效率？

使用DocumentFragment替代多次appendChild操作插入大量DOM元素时，使用innerHTML替代逐个构建元素处理列表子元素的点击事件时，使用事件代理使用addEventListener替代onxxx(比如onclick)进行事件绑定

答案4

在下列代码中，当点击div时，控制台输出的内容是？

<div id="a">code>

<div id="b"></div>code>

</div>

<script>

document.getElementById("a").addEventListener("click", e => {

console.log(1);

})

document.getElementById("b").addEventListener("click", e => {

e.preventDefault();

console.log(2);

})

</script>

12, 11,22

答案2

下面关于DOM事件描述错误的是？