web前端培训基础考试题

发布日期：2019-07-26 作者：atguigu 5674人浏览

Web前端培训学习阶段考试

一、选择题

1.下列方法中，能让网页中第5个div隐藏的是（C）。

A.$("div:5th-child").hide()

B.$("div:5th-child").hidden()

C.$("div:nth-child(5)").hide()

D.$("div:nth-child(5)").hidden()

2.下列元素中，为行内元素的是（B）。

A.div

B.span

C.p

D.h3

3.下列HTML代码中，能在新窗口中打开新浪首页的是（C）。

<a src="http://www.sina.com.cn">新浪</a>
<a src="www.sina.com.cn" target="_blank">新浪</a>
<a href="http://www.sina.com.cn" target="_blank">新浪</a>
<a href="http://www.sina.com.cn">新浪</a>

4.需要创建一个多选框，且和文本关联起来（单击文本就像单击核选框一样）。下列 HTML 代码中，正确的是（D）。

A.<input type="checkbox" /><label>记住我</label>

B.<input type="checkbox" /><label for="checkbox">记住我</label>

C.<input type="checkbox" id="c1" /><label>记住我</label>

D.<input type="checkbox" id="c1" /><label for="c1">记住我</label>

5.有内部样式表定义如下：

p{color:Red;font-size:15pt;}

</style>

同时，有 html 代码如下所示：

段落中的文本”p text“的最终显示效果是（A）。

A.蓝色文本，字体大小为 15pt，背景色为灰色

B.蓝色文本，默认字体大小，背景色为灰色

C.蓝色文本，字体大小为 15pt，无背景色

D.红色文本，字体大小为 15pt，无背景色

6.查看如下样式定义：

.A .B { font-weight:bold;}

下列选项中，文本加粗显示的是（C）。

A.<a class="A">文本A</a>

B.<a class="B">文本B</a>

C.<p class="A"><a class="B">文本C</a></p>

D.<p class="B"><a class="A">文本C</a></p>

7.下列引用外部样式表 style1.css 的语句中，正确的是（D）。

A.<link src="style1.css" type="text/css" rel="stylesheet" />

B.<link href="style1.css" type="css" />

C.<link src="style1.css" type="text/css" />

D.<link href="style1.css" type="text/css" rel="stylesheet" />

8.查看如下 html 代码：

此代码在页面上的显示效果为（A）。

A.<div> 中的文本和 <p> 中的文本分两行显示，且文本左对齐

B.<div> 中的文本和 <p> 中的文本在一行上显示，且文本左对齐

C.<div> 中的文本和 <p> 中的文本分两行显示，且文本右对齐

D.<div> 中的文本和 <p> 中的文本在一行上显示，且文本右对齐

查看如下 html 代码：

</div>

<p>

</p>

现需要定义样式，实现：当鼠标移入”帮助“链接上时，文本”帮助“的字体大小变为 20pt，而其他链接不变。下列样式定义中，正确的是（D）。

A.a:hover {font-size:20pt;}

B.div.header a:hover {font-size:20pt;}

C.#header a {font-size:20pt;}

D.#header a:hover {font-size:20pt;}

有样式定义如下：

div.parent {

width:100px;

height:70px;

border:1px solid gray;

}

div.child {

width:80px;

height:30px;

border:1px solid black;

background-color:silver;

}

同时，有 html 代码如下所示：

<body>

</div>

</body>

第二个 div 在页面上的最终位置是（B）。

A.其上边框距离其父元素（div）为 15 px 距离

B.其上边框距离 body 元素为 15 px 距离

C.其上边框距离其原有位置为 15 px 距离

D.使用默认位置，定位并未发生改变

.需要在 html 页面上引用脚本文件myJs.js，下列语句中，正确的是（D）。

A.<script language="javascript" href="myJs.js" type="text/javascript" />

B.<script language="javascript" src="myJs.js" type="text/javascript" />

C.<script language="javascript" href="myJs.js" type="text/javascript"></script>

D.<script language="javascript" src="myJs.js" type="text/javascript"></script>

12.查看如下 JavaScript 代码：

var a = "10";

var b = 10;

if (a == b)

alert("equal");

if (a === b)

alert("same");

此代码运行后，效果为（A）。

A.只弹出”equal“

B.只弹出”same“

C.先弹出”equal“，再弹出”same“

D.没有弹出显示

13.查看如下 JavaScript 代码（用于得到录入数值的整数部分）：

function getInt() {

var str = document.getElementById("txtData").value;

if ( << 插入代码1 >> )

alert("请录入数值");

else {

var data = << 插入代码2 >>;

alert("整数部分为：" + data);

}

为实现所需功能，”插入代码1“和”插入代码2“处所需要的代码分别是（C）。

isNaN(str) 和 parseFloat(str)
!isNaN(str) 和 parseFloat(str)
isNaN(str) 和 parseInt(str)
!isNaN(str) 和 parseInt(str)

14.阅读如下代码：

var a1 = [1, 2, 12];

var a2 = [4, 23];

a1.concat(a2);

a1.sort();

alert(a1.join(";"));

代码运行后，alert 方法弹出的内容为（B）。

A.1;2;12

B.1;12;2

C.1;2;4;12;23

D.1;12;2;23;4

15.阅读如下代码：

var str1 = "abc123def456";

var str2 = str1.replace(/\d+/gi, "*");

代码运行后，str2 的内容为（D）。

A.abc***def

B.abc***def***

C.abc*def

D.abc*def*

16.html 页面主体的代码如下：

<body>

<form>

</form>

</body>

下列选项中，能向文本框中写入文本的是（AC）。 (多选题)

A.document.getElementById("t1").value = "aa";

B.document.getElementById("t1").innerHTML = "bb";

C.document.getElementsByTagName("input")[0].value = "cc";

D.document.getElementsByTagName("input")[0].innerHTML = "dd";

有数组定义如下：

var a1 = [1, 14, 4, 12, 23];

现需要实现对数组 a1 中的内容按照数值大小升序排列，下列代码中，错误的是（C）。

A.a1.sort(new Function("a", "b", "return a-b;"));

B.a1.sort(function (a, b) { return a - b; });

C.a1.sort(new function (a, b) { return a - b; });

D.a1.sort(sortFunc);

function sortFunc(a, b) {

return a - b;

}

18.HTML 页面上有一个超链接，要实现当鼠标移入该超级链接时，超级链接的文本背景色变为灰色。下列选项中，能实现此功能的是（D）。

A.<a href="#" οnmοuseοver="this.style.background.color='gray';">注册</a>

B.<a href="#" οnmοuseοut="this.style.background-color='gray';">注册</a>

C.<a href="#" οnmοuseοver="this.style.backgroundColor=gray;">注册</a>

D.<a href="#" οnmοuseοver="this.style.backgroundColor='gray';">注册</a>

现需要在页面上实现动态时钟的显示，其 html 代码如下：

</body>

相应的 JavaScript 代码如下：

function initialClock() {

//<< 插入代码 >>;

};

function timerFunc() {

var v = new Date()

document.getElementById("mySpan").innerHTML = v.toLocaleTimeString();

}

为实现所需功能，”插入代码“处所需要的代码是（A）。

window.setInterval(timerFunc,1000);
window.setInterval(timerFunc(),1000);
window.setTimeout(timerFunc,1000);

D.window.setTimeout(timerFunc(),1000);

下列选项中，不是 window 对象的子对象的是（D）。

A.location

B.history

C.screen

D.arguments

html 页面上有一个 id 值为 s1 的 <select> 元素，现需要使用 JavaScript 代码清空其所有选项，下列选项中，错误的是（D）。

A.document.getElementById("s1").options.length = 0;

B.document.getElementById("s1") = null;

C.while (document.getElementById("s1").options.length > 0) {

document.getElementById("s1").remove(0);

}

D.var selObj = document.getElementById("s1");

while (selObj.childNodes.length > 0) {

selObj.removeChild(selObj.lastChild);

html 页面上有一个 id 值为 b1 的按钮，现需要使用 JavaScript 代码为其定义单击事件：单击该按钮后，弹出“Hello”。下列选项中，错误的是（C）。

A.document.getElementById("b1").onclick = function () { alert("hello"); };

B.document.getElementById("b1").onclick = new Function("alert('hello'); ");

C.document.getElementById("b1").onclick = new function () { alert("hello"); };

D.document.getElementById("b1").onclick = clickFunc;

function clickFunc() {

alert("Hello");

}

html 页面上有一个 id 值为 s1 的 <select> 元素，现需要使用 JavaScript 代码向列表中添加一个选项（<option>元素），下列选项中，错误的是（B）。
document.getElementById("s1").appendChild(new Option("aa", 18));
document.getElementById("s1").add(new Option("bb", 18));
document.getElementById("s1").options[document.getElementById("s1").options.length] = new Option("cc", 18);
document.getElementById("s1").options.appendChild(new Option("dd", 18));

24.下列哪个样式定义后,行级(非块状)元素可以定义宽度和高度( C)。

display:inline
display:none
display:block
display:inheric

下列哪些是设置有关边框的属性（ABC）（多选题）

A、border-color

B、border-style

C、border-width

D、border-back

下列代表无序清单的标签是（ A ）

A、 <ul>…<li>…</ul>

B、<ol>…<li>…</ol>

C、<hl>…<li>…</hl>

D、< li >…< ol >…</ li >

在html文件中应用abc.css文件中的样式的方法有（A B）(多选题)

A、<link href="abc.css" type="text/css" rel="stylesheet">

B、<style type="text/css">@import url(abc.css);</style>

C、<style type="text/css">@import (abc.css);</style>

D、<style type="text/css">import url (abc.css);</style>

28．下列哪种方式是用类选择器定义样式的（B）

A、p{color:red;}

B、.one{color:red;}

C、#two{color:red;}

D、p,h1{color:red;}

window对象的方法中，(A ）方法是用于弹出确认对话框，可让选择“确定”或“取消”

A、confirm() B、alert() C、prompt() D、open()

以下JavaScript变量名不合法的有（AC B）（多选题）?

A、4Myvariable B、My@variable C、function D、Myvariable4

在JavaScript程序中加入注释，方法有（AB）(多选题)

A、//注释内容 B、/*注释内容*/ C、/注释内容 D、/*注释内容

在jquey中，如果想要从DOM中删除所有匹配的元素，下面哪一个是正确的C

A、delete() B、empty() C、remove() D、removeAll()

如果想在一个指定的元素后添加内容，下面哪个是实现该功能的？D

A、append(content) B、prepend(content) C、before(content) D、after(content)

在jquery中想要找到div元素的后辈div元素，下面哪一个是可以实现的？C

A、$(div div) B、$(div.div) C、$(div~div) D、$(div+div)

下面对表单的POST提交方式描述不正确的是（ A ）。
若直接在地址栏中输入URL按回车按GET方式提交；
若属性method不指定任何值或者不加属性method，默认按GET方式提交；
只有在method指定为POST时才按POST方式提交；
POST提交是将表单字段信息放置到请求头中；

如何找到表单中隐藏的div？D

A、$("div:none") B、$("div:invisiable") C、$("div:even") D、$("div:hidden")

关于文档对象模型（Document Object Model），如下说法错误的是：C
DOM能够以编程方式访问和操作web页面内容。
DOM允许通过对象的属性和方法访问页面中的对象。
DOM能够创建动态的文档内容，但是不能删除文档对象。
DOM也提供了处理事件的接口，它允许捕获和响应用户以及浏览器的动作。

38.关于HTML5说法正确的是：C

A、HTML5只是对HTML4的一个简单升级

B、所有浏览器都支持HTML5

C、HTML5新增了离线缓存机制

D、HTML5书写格式要求必须按照书写规范

关于javascript语言说法错误的是？C

A.JavaScript是目前Web应用程序开发者使用最为广泛的客户端脚本编程语言。

B.javaScript是网景公司专为Navigator浏览器开发、实现网页内容交互的功能。

C.javascript是由SUN公司开发的。

D.ECMAScript是一个为了规范Javascript语言而产生的国际标准。

表达式5+22/2%2的计算结果是：B

A.5 B.6 C.7 D.8

二、简答题

display:none和visibility:hidden的区别是什么?

答：display:none 不为被隐藏的对象保留其物理空间

visibility：hidden 为被隐藏的对象保留其物理空间

也就是display:;当他的值变成block 的时候，它所在的结构才会被加载进来。

而visibility就会在加载页面的同时就已经把它加载进来了，

因为他的值为hidden的时候，它所占的空间还在。

如何居中div？

答:设置宽度：还设置 margin: 0px auto;

编写一个正则表达式：判断字符串是否是这样组成的，第一个必须是字母，后面可以是字母、数字、下划线，总长度为5-20

答：var reg=/^[A-Za-z]\w{4,19}$/；

alert(reg.test("avcd12345"));

使用字符串函数来截取字符串中的efg

var str="ddfjfjkefg";

alert(str.substr(7,3))

CSS的盒子模型由什么组成？

1.内容（content）————我们往往给块级元素设置高度和宽度就是内容的高度和宽度

2.边框（border）————边框的粗细是盒子的一部分（四个边框）

3.内边距（padding）————内容和边框的距离（四个方向）

4.外边距（margin）————边框四周的空间，距离父容器的距离（四个方向）

上一篇：大数据培训那家强 下一篇：报名尚硅谷课程怎么收费