1+x 证书 Web 前端开发初级理论考试（试卷8 ）

Web前端开发初级模拟测试卷（三）

共55道题 总分：200分 形考总分：0分

一、单选题共30题，60分

1.实现向右的红色三角形，样式实现正确的是（ ） A

<div class="icon"></div>

A.icon{width:0; height:0; overflow:hidden; border:5px solid transparent; border-left-color:#f00; }

B.icon{width:0; height:0; overflow:hidden; border:5px solid #f00; border-left-color:transparent;}

C.icon{width:0; height:0; overflow:hidden; border:5px solid transparent; border-right-color:#f00;}

D.icon{width:0; height:0; overflow:hidden; border:5px solid #f00; border-right-color:transparent;}

2.p下面除了span以外所有标签，旋转45度（ ）

- *A*p :not(span){transform:rotate(45deg)}
- *B*p :not(span){translate:rotate(45deg)}
- *C*p not(:span){transform:rotate(45deg)}
- *D*p:not(span){rotate(45deg)}

3.jquery中遍历指定的对象和数组是哪个方法（ ） A

• A$.each( object, callback )
• B$(selector).each(function())
• Cforeach()
• Dfor ...in

4.arguments是一个类似于数组的对象。对命名参数的引用可以使用参数名也可以使用（ ）的方式来进行引用：C

• Afunction argument[n]
• Barguments.n
• Carguments[n]
• Disfunction

5.下面代码的打印结果是( ) C

var cars = ['bmw','qq','byd','glof']; cars.splice(2,0,'polo'); console.log(cars);

• A["bmw", "qq", "byd", "polo", "glof"]
• B["bmw", "qq", "polo", "glof"]
• C["bmw", "qq", "polo", "byd", "glof"]
• D以上都不对

6.下面是兄弟选择器的选项是（ ） B

• A#ul2+p
• B#ul2~p
• C#ul2>p
• D#ul2 p

7.以下是画布可以画图像的是（ ） C

• Avideo
• Baudio
• Ccanvas
• Dheader

8.在jQuery中，不属于鼠标事件的是（ ） C

• Amouseover
• Bmouseenter
• Ckeydown
• Dmousemove

9.input标签的值是用哪个属性来描述的（ ） D

• Atype
• Bdisabled
• Cid
• Dvalue

10.以下哪个的优先级最高（ ） C

• Aclass
• Bid
• C!important
• D行内

11.下面代码的打印结果是( )D

 for(var i=0;i<=30;i+=5){ if(i%3==0){ continue; } console.log(i); }

• A5,10,15,20,25,30
• B5,15
• C5,15,25
• D5,10,20,25

12.想要给个a标签设置width和height，需要给a标签添加哪个样式（ ） D

• Adisplay:inline;
• Boverflow:hidden;
• Cfont-size:0;
• Ddisplay:block;

13.设置主轴方向的弹性盒子元素的对齐方式可以使用（ ）属性实现 B

• Aalign-content
• Bjustify-content
• Calign-self
• Dalign-items

14.参数序号从1开始的是哪个选择器（ ） B

• Anth-of-type
• Bnth-child
• C:first
• D:eq

15.以下代码执行结果正确的是( ) B

var a = 2; switch (a) { case 1: alert("1"); case 2: alert("2"); case 3: alert("3");

default: alert('4'); }

• A分别弹出1234
• B分别弹出 234
• C程序报错
• D只弹出 2

16.flex-grow的作用是（ ） D

• A弹性盒子元素对齐方式
• B弹性盒子元素的排列方式
• C弹性盒子元素显示次序
• D弹性盒子元素如何分配剩余空间

17.以下哪个方法是对数组进行排序（ ） A

• Asort
• Breverse
• Cpop
• Dslice

18.以下哪些不是块标签的是（ ） A

• Aspan
• Bp
• Cdiv
• Dul

19.以下能生效的样式选项是（ ） C

<style> p{ color:yellow; } .classB{ color:red; } .classA{ color:blue; } </style> <p class='classB classA'> 123 </p>

• Ayellow
• Bred
• Cblue
• Dblack

20.meta标签中name属性值是关键字的是（ ） C

• Adescription
• Bauthor
• Ckeyword
• Dgenerator

21.javascript怎样将一个checkbox设为无效，假设该checkbox的id为checkAll ( ) B

• Adocument.getElementById("checkAll").enabled = false;
• Bdocument.getElementById("checkAll").disabled = true;
• Cdocument.getElementById("checkAll").enabled = true;
• Ddocument.getElementById("checkAll").disabled = "disabled";

22.以下这段代码的作用是（ ） A

@media screen and (min-width:960px) and (max-width:1200px){ body{ background:yellow; } }

• A是当宽度大于960px小于1200px的时候body的背景色为yellow
• B是当宽度大于960px的时候body的背景色为yellow
• C以上写法都不正确
• D是当宽度小于1200px的时候body的背景色为yellow

23.实现点击文本也能控制复选框，以下设置正确的是（ ） B

• - *A*<input type="checkbox" name="music" /><label for="music">音乐</label>
  - *B*<input type="checkbox" id="music" /><label for="music">音乐</label>
  - *C*<input type="checkbox" name="music" /><label id="music">音乐</label>
  - *D*<input type="checkbox" id="music" /><label name="music">音乐</label>
  

24.如果按下的是回车键：js中正确的判断方式是（ ） C

• Aif(event.keyCode == 39)
• Bif(event.keyCode == 38)
• Cif(event.keyCode == 32)
• Dif(event.keyCode == 31)

25.哪一个标记用于使HTML文档中表格里的单元格在同行进行合并（ ） C

• Acellspacing
• Bcellpadding
• Crowspan
• Dcolspan

26.如何清除ul的浮动（ ） B

• Aul li:last-child{clear:both}
• Bul:after{content:"";clear:both;display:block}
• Cul{clear:both}
• Dul:before{content:"";clear:both;display:block}

27.var v; 该语句定义了一个变量v，它的值是？正确答案是（ ） B

• A1
• Bundefined
• C0
• Dnull

28.placeholder的作用是（ ） A

• A为文本框设置默认提示文字
• B为文本框设置对齐样式
• C为文本框设置默认值
• D以上说法都不正确

29.正确答案是（ ） A

var size="true";console.log(typeof size);

• Astring
• Bnumber
• Cundefined
• Dboolean

30.在当前页面index.html中插入与index.html处于同一级的img文件夹下的logo.jpg，正确的导入写法是（ ）A

• - *A*<img src="img/logo.jpg">
  - *B*<img href="img/logo.jpg">
  - *C*<img src="../img/logo.jpg">
  - *D*<img href="../img/logo.jpg">
  

  二、多选题共15题，30分

  1.div span{margin-left:10px;}通过以下哪些语句可以将第一个span元素的margin取消( ) AC

  • Aiv span:first-child{margin:0}
  • Bdiv span:nth-child(0){margin:0;}
  • Cdiv span:nth-child(1){margin:0}
  • Ddiv span{margin:0}

2.以下语句语法正确的有（ ） AC

• - *A*document.getElementsByTagName("body")[0].innerHTML = "HELLO"
  - *B*document.getElementById("box").style.border-top="1px solid #f00"
  - *C*document.getElementsByTagName("div")[0].innerHTML = '<b>hello</b>';
  - *D*document.getElementsByTagName("body").style.paddingTop = "10px";
  

3.以下哪些属性属于弹性盒子的（ ） AB

• Aflex-shrink
• Bflex-grow
• Cborder
• Dmargin

4.以下是单独可以不用闭合的标签是（ ） ABCD

• - *A*<br />
  - *B*<hr />
  - *C*<input />
  - *D*<img />
  

5.#wrap{width:600px;height:200px;background:#ccc;position:absolute;}实现wrap在浏览器中水平和垂直都居中，需要设置的样式有( ) BC

• Amargin-left:-300px;margin-top:-100px;
• Bleft:300px;top:100px;
• Cleft:50%;top:50%;
• Dmargin-left:-300px;margin-top:100px;

6.背景background属性包括（ ） ABD

• Abackground-size
• Bbackground-origin
• Ctext-align
• Dbackground-clip

7.假设btn是获取到的按钮，点击按钮调用checkCity这样一个函数，以下写法正确的有哪些（ ） BC

• Abtn.onclick = function(){checkCity;}
• Bbtn.onclick = function(){checkCity();}
• Cbtn.onclick = checkCity;
• Dbtn.onclick = checkCity()

8.HTML5新增的标签有哪些（ ） ABCD

• Aheader
• Bnav
• Cfooter
• Dsection

9.以下哪些语句可以打印1-100之间所有的奇数（ ） AD

• Afor(var i=1;i<=100;i++){if(i%2==1){console.log(i);}}
• Bfor(var i=1;i<=100;i+=1){console.log(i);}
• Cfor(var i=1;i<=100;i++){if(i%2==0){console.log(i);}}
• Dfor(var i=1;i<=100;i+=2){console.log(i);}

10.img标签有文字提示特性的属性（ ） AC

• Atitle
• Btite
• Calt
• Dheight

11.以下哪些元素属于块元素( ) BCD

• Aa
• Bnav
• Cheader
• Dul

12.下面选项中 jquery焦点事件的有（ ） AC

• Ablur()
• Bselect()
• Cfocus()
• Donfocus()

13.在jQuery中，通过jQuery对象.css( )可实现样式控制，以下说法正确的是（ ） AB

• Acss( )方法会去除原有样式而设置新样式
• B正确语法：css(“属性”,”值”)
• Ccss( )方法不会去除原有样式
• D正确语法：css(“属性”)

14.以下哪些样式可以隐藏元素( ) ACD

• Avisibility:hidden;
• Bdisplay:show;
• Cdisplay:none;
• Dopacity:0;

15.哪些是动画效果( ) AB

• Atransition
• Banimation
• Cstatic
• Drelative

三、判断题共5题，10分

1.此句可以实现当文本框获得焦点时添加盒阴影效果。（ ） 对

input[type="text"]:focus{box-shadow:2px 2px 2px blue;}

• A对
• B错

2.var a=b=6; b=3 console.log(a)的值为3吗（ ） 错

• A对
• B错

3.在jquery中指定的元素后面追加内容是after吗（ ） 对

• A对
• B错

4.margin-top与padding-top对行内元素都起作用（ ） 错

• A对
• B错

5.CSS中transition是用来控制元素变形样式的（ ） 错

• A对
• B错

答案解析

1.	2.	3.	4.	5.
6.	7.	8.	9.	10.
11.	12.	13.	14.	15.
16.	17.	18.	19.	20.
21.	22.	23.	24.	25.
26.	27.	28.	29.	30.
31.	32.	33.	34.	35.
36.	37.	38.	39.	40.
41.	42.	43.	44.	45.
46.	47.	48.	49.	50.