前端基础练习题第30天 答案及解析

本篇文章是前端基础练习题第三十天的答案及解析部分，纯题目部分请移步前端基础练习题 第30天

正文

1.JS中常见的内存泄漏原因有哪些？

常见的内存泄漏原因有4个：

• 全局变量引起内存泄漏
• 闭包引起内存泄漏
• DOM清空或删除时，事件未清除导致的内存泄漏
• 子元素存在引用引起的内存泄漏

2.相比于原生js，使用jQuery有哪些好处？

jQuery具有如下优点：

• 它有强大的选择器、出色的DOM操作的封装
• 有可靠的事件处理机制
• 有完善的ajax封装
• 具备出色的浏览器兼容性
• 支持链式操作和隐式迭代
• 具有完善的文档和丰富的插件

3.jQuery中的$符号是什么？

$符号只是jQuery的别名，它是jQuery的选择器，通过它可将DOM对象转为jQuery对象。当然，也完全可以使用jQuery来代替$。

4.jQuery对象和DOM对象如何转化？

jQuery对象是一个包含了DOM对象的数组。可通过jQuery对象[下标]来获取DOM对象，也可通过$(DOM对象)来将DOM对象转换为jQuery对象。

5.jQuery中有几类选择器？

jQuery中大致有5类选择器：

• 基本选择器，如$("#id")、$(".class")、$("div")等
• 层次选择器，如$("div p")、$("form > input")等
• 过滤选择器，如$("li:first")、$("tr:even")等
• 属性选择器，如$("input[name='text']")等
• 表单选择器，如$(":hidden")、$(":selected")等

6.jQuery如何去操作样式？

如下所示：

• jQuery添加类名，addClass()
• jQuery删除类名，removeClass()
• jQuery切换类名，如果有就移除，如果没有就添加，toggleClass()
• 或者直接操作CSS，方式为$('dom').css({ key: value })。

7.请使用jQuery编写一个函数，此函数绑定到body的mousemove事件上，在事件中输出鼠标的位置。

参考代码如下所示：

$('body').mousemove(function(e) {
  console.log(e.pageX, e.pageY);
})

可通过事件对象的pageX、pageY属性获得鼠标的位置。

8.利用jQuery编写代码，使页面中的第一个表格能够进行隔行换色(表格的奇数行与偶数行的背景色不同)。

参考代码如下所示：

$('table:first tr:even').css('backgroundColor', '#ccc')

本题主要是考察jQuery过滤选择器和其对CSS的操作方法。

说明

1. 题目中出现的JS指的是采用ECMAScript 2015及之后标准的JavaScript

2. 答案中，若有错误和需完善的地方，可在下方留言反馈哈~~

3. 查看纯习题版，请点击前端基础练习题 第30天