牛客前端宝典——刷题 ##Day13

简介: 🏆编程就像我们平常做题一样,如果只是一味的学习不去做题的话所得到的效果微乎其微。

函数

描述一:函数——参数对象

请补全JavaScript函数,要求返回它的参数伪数组对象

返回参数是伪数组对象,我们想到了 arguments 的使用,除了这个还能用啥?可以用JS中的   Array.of() 方法。

图片.png

this

描述二:this指向

请补全JavaScript函数,使obj对象中fn函数返回该对象中a属性和b属性的和

从题目描述很容易看出调用对象中的属性可以通过this指向来调用,当然我们也可以用对象名点属性来调用,两者都可以。

图片.png

WebAPI

描述三:JS动态创建节点

请补全JavaScript函数,根据参数数组创建li元素

要求:

1. li元素的个数和数组的长度一样

2. li元素的内容是数组中的每个元素

3. 将创建的所有li元素插入到ul中

可以通过遍历数组的方式,将创建的li标签赋值到ul标签上。

图片.png

描述四:根据ID获取元素

请补全JavaScript函数,根据id获取html模块中ul标签下第二个li元素并返回

根据题目所示是根据id获取li元素,并返回结果,那么直接通过id获取第二个li元素并返回结果

JS获取DOM元素的方式有很多种,不熟悉的可以看下我的相关文章:获取DOM元素方式

图片.png

描述五:JS修改元素内容

请补全JavaScript函数,将类为"box"的div元素内容修改为"欢迎来到牛客网"

在JS中修改HTML元素的内容可以通过两种方式,一是:innerHTML;二是:innerText,而两者的区别可以看一下我的这篇文章的讲解:操作元素

图片.png

绑定事件

描述六:阻止冒泡事件

请补全JavaScript函数,要求在点击li元素的时候不触发ul的事件

注意:需要自行获取li元素。

根据题目所示通过点击事件阻止冒泡事件

图片.png

描述七: 阻止默认事件

请补全JavaScript函数,要求在点击id为"checkbox"的复选框时不会取消勾选状态

注意:需要自行获取input元素。

阻止默认事件的方式有很多,可以借助 preventDefault() ,当然也可以使用其他方法。

图片.png

操作地址栏

描述八:url地址

请补全JavaScript函数,实现一个函数返回页面当前url

返回当前页面的 url 地址,可以直接返回本地的href即可。

图片.png

综合练习

描述九:点击按钮隐藏元素

   请补全JavaScript代码,实现一个盒子的关闭按钮功能。

   要求:

   1. 使类为"btn"的div元素中心点定位在类为"box"的div元素右上顶点

   2. 使类为"btn"的div元素中内容"X"垂直水平居中

   3. 点击"X"按钮可以使类为"box"的div元素隐藏

这里需要借助 CSS的绝对定位和相对定位 的知识,前面的文章已经讲解过,主要是如何将box的盒子隐藏,在JS中借助 style.display=none 即可。

图片.png

相关文章
|
前端开发
#yyds干货盘点# 前端歌谣的刷题之路-第五十六题-移除数组中的元素
#yyds干货盘点# 前端歌谣的刷题之路-第五十六题-移除数组中的元素
79 0
#yyds干货盘点# 前端歌谣的刷题之路-第五十六题-移除数组中的元素
|
前端开发 JavaScript
#yyds干货盘点# 前端歌谣的刷题之路-第一百六十九题-call
#yyds干货盘点# 前端歌谣的刷题之路-第一百六十九题-call
96 0
#yyds干货盘点# 前端歌谣的刷题之路-第一百六十九题-call
|
前端开发 JavaScript
#yyds干货盘点# 前端歌谣的刷题之路-第一百七十题-bind
#yyds干货盘点# 前端歌谣的刷题之路-第一百七十题-bind
87 0
#yyds干货盘点# 前端歌谣的刷题之路-第一百七十题-bind
|
前端开发 JavaScript
#yyds干货盘点# 前端歌谣的刷题之路-第一百六十八题-object.create
#yyds干货盘点# 前端歌谣的刷题之路-第一百六十八题-object.create
56 0
#yyds干货盘点# 前端歌谣的刷题之路-第一百六十八题-object.create
|
前端开发 JavaScript
#yyds干货盘点# 前端歌谣的刷题之路-第一百六十七题-Array.reduce
#yyds干货盘点# 前端歌谣的刷题之路-第一百六十七题-Array.reduce
80 0
#yyds干货盘点# 前端歌谣的刷题之路-第一百六十七题-Array.reduce
|
前端开发 JavaScript
#yyds干货盘点# 前端歌谣的刷题之路-第一百六十七题-Array.map
#yyds干货盘点# 前端歌谣的刷题之路-第一百六十七题-Array.map
99 0
#yyds干货盘点# 前端歌谣的刷题之路-第一百六十七题-Array.map
|
前端开发 JavaScript
#yyds干货盘点# 前端歌谣的刷题之路-第一百六十六题-instanceOf
#yyds干货盘点# 前端歌谣的刷题之路-第一百六十六题-instanceOf
71 0
#yyds干货盘点# 前端歌谣的刷题之路-第一百六十六题-instanceOf
|
前端开发 JavaScript
#yyds干货盘点# 前端歌谣的刷题之路-第一百六十四题-快速排序
#yyds干货盘点# 前端歌谣的刷题之路-第一百六十四题-快速排序
76 0
#yyds干货盘点# 前端歌谣的刷题之路-第一百六十四题-快速排序
|
前端开发 JavaScript
#yyds干货盘点# 前端歌谣的刷题之路-第一百六十一题-事件委托
#yyds干货盘点# 前端歌谣的刷题之路-第一百六十一题-事件委托
96 0
#yyds干货盘点# 前端歌谣的刷题之路-第一百六十一题-事件委托
|
前端开发 JavaScript
#yyds干货盘点# 前端歌谣的刷题之路-第一百六十题-object.freeze
#yyds干货盘点# 前端歌谣的刷题之路-第一百六十题-object.freeze
65 0
#yyds干货盘点# 前端歌谣的刷题之路-第一百六十题-object.freeze

热门文章

最新文章