- 博客(136)
- 收藏
- 关注
RSS订阅原创 【JavaScript——函数编写】请到下一步（蓝桥杯真题-7326）【合集】
我们注册一个账号，经常会用到步骤条填写资料，本题需要使用 jQuery 去实现步骤条表单的切换。准备步骤├── css│ └── style.css├── js│ ├── index.js│ └── jquery-3.6.0.min.js├── effect.gif└── index.htmlcss/style.css 是样式文件。js/index.js 是实现步骤条表单切换的 js 文件。js/jquery-3.6.0.min.js 是 jQuery 文件。ef
2025-03-26 17:32:25
747
34
原创 【JavaScript——页面加载】年度明星项目（蓝桥杯真题-5138）【合集】
作为前端开发的主力语言，JavaScript相关的开源项目是每一个前端开发者都应该多多关注的。我们可以通过这一年新增 star 的数量来判断一个开源项目的流行趋势。本题请实现一个展示 2022 年JavaScript明星开源项目数据的网页。准备步骤├── css│ └── style.css├── effect.gif├── images├── index.html└── js ├── all-data.json ├── index.js ├── jquery-
2025-03-26 16:58:44
1115
33
原创 【JavaScript——函数编写】猜硬币（蓝桥杯真题-2461）【合集】
为了打发无聊的时间，小蓝开发了一款人机对战的猜硬币游戏，页面中一共有 9 个杯子，系统会随机挑选 3 个杯子在里面放入硬币，玩家通过输入含有杯子序号的字符串进行猜选，但是遇到了一些问题。本题需要你帮助小蓝完成猜硬币游戏。准备步骤├── css├── effect.gif├── images├── index.html└── js ├── findCoin.js └── index.jscss 是样式文件夹。images 是图片文件夹。index.html 是主页面。
2025-03-19 23:16:25
1108
3
原创 【JavaScript——函数编写】ISBN 转换与生成（蓝桥杯真题-5141）【合集】
国际标准书号（International Standard Book Number），简称 ISBN ，是专门为识别图书等文献而设计的国际编号。2007 年 1 月 1 日之前，ISBN 由 10 位数字组成，包括四个部分：组号（国家、地区、语言的代号），出版者号，书序号和检验码。2007 年 1 月 1 日起，实行新版 ISBN，新版 ISBN 由 13 位数字组成。新版 ISBN 编码增加了 EAN·UCC 前缀，这是为了与国际条形码编码 EAN·UCC 系统接轨。本题请实现一个ISBN-10。
2025-03-19 17:35:12
1009
1
原创 【JavaScript——函数编写】谁最长（蓝桥杯真题-7327）【合集】
如果给你若干个数组，你能很快判断出最长的都有哪些吗？本题需要在已提供的基础项目中，使用 JS 知识封装一个函数，该函数可以接收若干个一维数组作为参数，并最终返回长度最大的数组集合。准备步骤├── index.html└── js └── index.jsjs/index.js 是页面功能实现的逻辑代码。index.html 包含用于检测函数的代码。cd /home/projectwget https://labfile.oss.aliyuncs.com/courses/105
2025-03-18 18:03:09
585
1
原创 【JavaScript——函数编写】悠然画境（蓝桥杯真题-18560）【合集】
作为一名人工智能训练师，你需要使用数组中提供的指定语料进行训练，你可以用其中的词来组成任何句子来进行智能绘画的训练。准备步骤├── css├── images├── index.html├── effect.gif└── js └── index.jsindex.html 是主页面。css 是样式文件夹。images 是图片文件夹。js/index.js 是待补充的 js 文件。effect.gif 是项目最终完成的效果图。目标效果imageCount 表
2025-03-18 13:25:50
1015
1
原创 【JavaScript——函数编写】寻找小狼人（蓝桥杯真题-2456）【合集】
狼人杀”是一款多人参与的策略类桌面游戏。本题我们一起完成一个简易的狼人杀游戏，让我们找到其中的狼人。准备步骤├── css│ └── style.css├── images│ └── card.svg├── index.html└── js └── myarray.jscss/style.css 是样式文件。index.html 是主页面。images 是图片文件夹。js/myarray.js 是需要补充的 js 文件。cd /home/projectwg
2025-03-17 16:22:51
624
2
原创 【JS/jQuery——功能实现】传送门（蓝桥杯真题-2458）【合集】
日常浏览网页的时候，我们会发现一个问题，当页面太长、内容太多的时候我们很难快速浏览到心仪的内容。为了解决这个烦恼，优秀的产品研发团队发明了一种类似传送门的功能，以便用户能通过它快速定位到感兴趣的内容。这个功能也被通俗地比喻为“电梯”。本题需要在已提供的基础项目中使用 JS/jQuery 等知识完善代码，最终实现该功能。准备步骤├── effect.gif├── index.html├── css├── images└── js ├── index.js └── jquery-
2025-03-14 17:44:28
706
2
原创 【HTML——网页布局】蓝桥知识网（蓝桥杯真题-2453）【合集】
蓝桥为了帮助大家学习，开发了一个知识汇总网站，现在想设计一个简单美观的首页。本题请根据要求来完成一个首页布局。准备步骤├── css│ └── style.css├── data.txt├── index.html└── mark.pngcss/style.css 是样式文件。data.txt 是页面数据文件。index.html 是主页面。mark.png 是页面参数标注图。cd /home/projectwget https://labfile.oss.aliyun
2025-03-14 11:01:15
605
3
原创 【CSS——页面布局】新鲜的蔬菜（蓝桥杯真题-2439）【合集】
厨房里新到一批蔬菜，被凌乱地堆放在一起，现在我们给蔬菜分下类，把相同的蔬菜放到同一个菜板上，拿给厨师烹饪美味佳肴吧。准备步骤├── css│ └── style.css├── images└── index.htmlcss/style.css 是需要补充代码的样式文件。images 是图片文件夹。index.html 是主页面。cd /home/projectwget https://labfile.oss.aliyuncs.com/courses/9788/02.zip
2025-03-06 20:29:58
863
14
原创 【Html.js——函数编写】分一分（蓝桥杯真题-2438）【合集】
如果给你一个数组，你能很快将它分割成指定长度的若干份吗？本题需要在已提供的基础项目中使用 JS 知识封装一个函数，达到分割数组的要求。准备步骤├── effect.gif├── index.html└── js └── index.jseffect.gif 是最终实现的效果图。index.html 是主页面。js/index.js 是需要补充代码的 js 文件。cd /home/projectwget https://labfile.oss.aliyuncs.com/c
2025-03-05 16:42:36
802
11
原创 【CSS——效果实现】爱拼才会赢（蓝桥杯真题-18568）【合集】
由爱拼社举办的拼图大赛进行到最后一关，1 号选手小蓝披荆斩棘成为全场黑马。本关卡需要选手使用 CSS Grid 布局完成拼图页面，但是由于小蓝技术水平有限，拼图的效果没有达到预期。现在邀请你作为协助嘉宾帮助小蓝优化拼图页面的效果。本题需要在已提供的基础项目中，使用 CSS 让拼图正确显示。准备步骤├── css│ └── style.css├── images└── index.html目标效果要求规定请勿修改 css/style.css 文件外的任何内容。请严格按照考试步
2025-03-04 20:35:04
734
5
原创 【Html.js——Bug修复】迷惑的 this（蓝桥杯真题-6183）【合集】
团队开发中为了解决变量相互覆盖的问题，会将相关的功能的涉及到变量收编到一个对象内。但使用对象收编变量后需要注意this合理使用。准备步骤├── css│ └── style.css├── index.html└── js └── index.jsindex.html 是主页面。css 是存放项目样式的文件夹。js/index.js 是需要补充代码的 js 文件。cd /home/projectfile="this" && wget "https://labfile.
2025-02-27 20:38:19
642
10
原创 【Html.js——Bug修复】找回连接的奇幻之旅（蓝桥杯真题-18559）【合集】
在网络世界中，突然间失去了所有的连接。作为勇敢的冒险者，你将踏上一段惊险刺激的旅程，穿越充满谜题和挑战的网络景观，与神秘的网络幽灵对抗，解开断网之谜，找回失去的连接，带领人们重返数字世界。准备好迎接这场奇幻之旅吗？准备步骤├── css├── images├── index.html├── effect.gif└── js └── index.jsindex.html 是主页面。css 是样式文件夹。images 是图片文件夹。effect.gif 是项目最终完成的效果图
2025-02-25 16:08:24
993
10
原创 【Html.js——功能实现】产品360度展示（蓝桥杯真题-18557）【合集】
在电子商务网站中，用户可以通过鼠标或手势交互实现 360 度全方位查看产品，提升用户体验。现在需要你设计一个Pipeline管道函数，用于控制 360 度展示产品的动画序列，通过管道连接各个动画步骤，使产品以流畅的方式呈现给用户。准备步骤├── css├── effect.gif├── js│ ├── index.js│ └── utils.js└── index.htmlcss 是样式文件夹。index.html 是主页面。js/index.js 是动画序列代码的 js
2025-02-20 19:35:20
1454
22
原创 【Html.js——功能实现】布局切换（蓝桥杯真题-18556）【合集】
为了提高用户体验，网站有时需要多种浏览模式。现在特邀请你为蓝桥官网设计具有经典、浏览和工具三种布局模式。使用户可以根据具体情况选择合适的模式，以便更好地浏览网页内容。本题需要在已提供的基础项目中使用 JS 完善代码实现布局的切换。准备步骤├── css├── images├── index.html├── effect.gif└── js └── index.jscss 是样式文件夹。images 是图片文件夹。index.html 是主页面。effect.gif 是最终完
2025-02-19 23:39:16
1052
10
原创 【Html.js——功能实现】分享点滴（蓝桥杯真题-18555）【合集】
在数字时代，信息分享变得日益普遍和重要。无论是个人经历、知识技能还是创意想法，分享已经成为连接人与人之间的桥梁，是促进交流和学习的重要途径。用户可以分享自己的见解、经历、学习和创作，将点滴的智慧和灵感分享给世界。本题需要在已提供的基础项目中使用 JS 知识封装一个函数，完成分享。准备步骤├── css├── js| └── index.js└── index.htmlcss 是样式文件夹。index.html 是主页面。js/index.js 是待补充代码的 js 文件。目
2025-02-19 22:55:56
697
4
原创 【Html.js——效果实现】冰墩墩心情刻画尺（蓝桥杯真题-6182）【合集】
2022 奥运会满意度调查开始了，冰墩墩作为奥运吉祥物以亲民可爱的形象火遍全球，这次，冰墩墩请你打分，满分 5 分，最低 1 分，快来评分吧！准备步骤├── css│ └── index.css├── index.html└── js └── index.jsindex.html 是主页面。css 是存放页面样式的文件夹。js/index.js 是需要补充代码的 js 文件。wget https://labfile.oss.aliyuncs.com/courses/1
2025-02-18 17:14:13
1181
18
原创 【CSS——效果实现】地球漫游（蓝桥杯真题-6181）【合集】
"地球漫游"：一款基于 CSS 动画的小型网页应用，让您身临其境地感受地球绕着太阳公转的奇妙旅程。通过这个应用，您可以观察地球绕着太阳的运动轨迹和速度，感受到宇宙的浩瀚和神秘。准备步骤├── css│ └── style.css└── index.htmlindex.html 是主页面。css/style.css 是需要补充代码的 css 文件。cd /home/projectfile="earth" && wget "https://labfile.oss.aliyuncs.
2025-02-18 16:21:08
1056
6
原创 【CSS——效果实现】动态的 Tab 栏（蓝桥杯真题-6180）【合集】
日常在使用移动端 APP 或访问 PC 端网站的时候，常常发现在一些有工具栏或者 Tab 栏的页面会有顶栏固定的效果。简单来说，在页面未开始滚动时顶栏处在其原有的位置上，当页面向下滚动一定区域后，顶栏会跟随滚动固定在页面上方。本题请实现一个顶栏固定的课程网站首页。
2025-02-17 21:13:06
1248
42
原创 【CSS——效果实现】自适应页面（蓝桥杯真题-5136）【合集】
响应式布局是在 2010 年 5 月份提出的一个概念，这个概念是为解决移动互联网浏览而诞生的。简而言之，就是一个网站能够兼容多个终端——而不是为每个终端做一个特定的版本。通过响应式布局可以为不同终端的用户提供更加舒适的界面和更好的用户体验，而且随着大屏幕移动设备的普及，用“大势所趋”来形容也不为过。因此越来越多的设计师采用这个技术。本题需要在已提供的基础项目中，使用 CSS 或者 DOM 操作达到 Menu 和内容页自适应的效果。准备步骤├── css│ └── style.css├── i
2025-02-17 17:04:56
954
26
原创 【Html.js——功能实现】收集帛书碎片（蓝桥杯真题-5135）【合集】
三叔在外出考古途中无意发现了一份战国帛书，帛书边缘有被明显裁剪过的痕迹，单从帛书片段，提到记录了神秘文物的地点，无奈帛书不完整，为了早日将文物带回博物馆，三叔号召当地村民闷油瓶、王胖子、潘子共同寻找剩余帛书碎片，相约一炷香后再聚。本题需要在已提供的基础项目中使用 JS 知识封装一个函数，达到收集帛书碎片的要求。准备步骤├── js│ └── collect-puzzle.js├── css│ └── style.css├── images└── index.htmlindex
2025-02-16 17:23:42
1429
9
原创 【Html.js ——效果实现】图片水印生成（蓝桥杯真题-5134）【合集】
很多网站都会通过给图片添加水印的形式来标记图片来源，维护版权。前端生成水印通常是通过canvas实现，但实际上我们也可以直接利用CSS来实现图片水印，这样做会有更好的浏览器兼容性。本题中你将封装一个创建文字水印的函数。准备步骤├── css│ └── style.css├── images│ └── origin.png├── index.html└── js ├── dom-to-image.js └── index.jsindex.html 是主页面。c
2025-02-16 17:06:15
916
2
原创 【CSS ——功能实现】电影院排座位（蓝桥杯真题-5133）【合集】
随着人们生活水平的日益提升，电影院成为了越来越多的人休闲娱乐，周末放松的好去处。各个城市的电影院数量也随着市场的需求逐年攀升。近日，又有一个电影院正在做着开张前期的准备，小蓝作为设计工程师，需要对电影院的座位进行布局设计。本题需要在已提供的基础项目中，使用 CSS 达到对电影院排座位的目的。
2025-02-15 18:50:49
903
6
原创 【Vue.js ——功能实现】趣购（蓝桥杯真题-2426）【合集】
在线购物几乎已经是现代生活必备的一环，每年的 618，双 11 都是购物的狂欢。我们几乎可以在线上购物商城买到一切日常所需。本题需要在已提供的基础项目中，使用 Web 原生拖拽事件实现在线购物的功能。准备步骤├── images│ ├── book.jpeg│ ├── box.jpeg│ ├── paper.jpeg│ ├── trolley.jpeg│ └── tv.jpg├── index.html├── effect.gif├── js│ ├── ht
2025-02-14 18:48:35
913
6
原创 【JavaScript ——异步函数】封装 Promisefy 函数（蓝桥杯真题-2425）【合集】
我们知道在浏览器中 JavaScript 是单线程运行的，而回调函数曾经是 JavaScript 中实现异步函数的主要方式，面对这样的嵌套回调，处理错误也会变得非常困难：你必须在“金字塔”的每一级处理错误，而不是在最高一级一次完成错误处理，所以大多数现代异步 API 采用的都是 Promise 的形式。下面就请你以 Node.js 中常用的读取文件操作为例，封装一个 Promisefy 函数，将回调形式调用的读取文件方法转换成一个 Promise 的版本。
2025-02-12 23:14:17
1080
10
原创 【Vue.js——Bug修复】消失的 Token（蓝桥杯真题-2424）【合集】
小蓝开发了一个登录功能，但是在登录界面中输入用户名后点击“确认”按钮并没有如预期般成功进入欢迎界面。但是从出现欢迎语来看，数据已经发生了改变，到底是怎么回事呢？请帮助小蓝排查代码，让登录功能回归正常吧！1. 页面初始化Vuex 存储初始化：代码中定义了 BaseModule 和 UserModule 两个 Vuex 模块，并创建了一个 Vuex 存储实例 store。BaseModule 存储了欢迎信息，初始状态下 welcome 的值为 '请输入用户名登录系统'。UserModule 存储了用户相
2025-02-10 17:44:08
1175
48
原创 【Vue.js——功能实现】心愿便利贴（蓝桥杯真题-2423）【合集】
小蓝发现人之间面对面交流逐渐减少，倾诉的机会变少了，有些人比较腼腆保守，不敢大声说出自己的心里话，期盼之类的，容易造成压力过大，心愿便利贴可以匿名，提供大家安全隐秘方便的倾诉平台。小蓝希望大家写下自己的目标、理想、愿望等，激励自己奋斗，积极向上......写出来做一个精神寄托。可是，小蓝对 Vue 语法不熟，便利贴没能完成，快来帮助小蓝完成吧！准备步骤├── css│ ├── fonts│ │ ├── element-icons.ttf│ │ └── element-ico
2025-02-10 09:00:00
729
32
原创 【Html.js——功能实现】蓝桥校园一卡通（蓝桥杯真题-2421）【合集】
每年大一新生报道时，都需要办一张校园一卡通，无论吃饭、洗澡、买东西、甚至去图书馆借书都要用，小蓝想帮助学校做一个制卡界面，但是用 js 做用户输入验证不知道怎么写，快来帮助小蓝完成这个页面吧！准备步骤├── css│ ├── wish.css │ └── index.css├── images │ └── college.jpg └── index.htmlindex.html 是主页面。images 是图片文件夹。css 是样式文件夹。wget https:
2025-02-09 19:49:33
1211
13
原创 【Html.js——Echarts图表】商品销量和销售额实时展示看板（蓝桥杯真题-2420）【合集】
双 11、618 是近些年来兴起的购物节，每到这个时候商品的销售数量和销售额都非常巨大。如此庞大的数据通过表格的形式很难观察其增减趋势，图表能更加直观的显示数据的变化。目前，云课后台已经实时统计了 1 小时平台课程的销售数量和销售额，本题需要使用echarts将这些数据用图表的方式显示到前端。准备步骤├── effect.gif├── css│ └── index.css├── index.html└── js ├── echarts.js └── index.js
2025-02-09 00:02:07
1050
20
原创 【CSS——Sprite Sheet 精灵图动画】西游记之西天取经（蓝桥杯真题-2419）【合集】
师徒四人一行向西天拜佛求经，不料中途被妖怪施了法术动弹不得！俗话说救人一命胜造七级浮屠！情急之下小蓝挺身而出，灵机一动，用css行善施救，让师徒西行而去，从而普渡众生，善哉，善哉！准备步骤├── images │ ├── background.webp│ ├── west_01.png│ ├── west_02.png│ ├── west_03.png │ └── west_04.png└── index.htmljs/echarts.js 是 ECharts
2025-02-07 19:59:29
1256
17
原创 【Html.js——Bug修复】和手机相处的时光（蓝桥杯真题-2450）【合集】
现在都提倡健康使用手机，那么统计一下在一周中每天使用手机的情况吧！本题使用 ECharts 实现统计手机使用时长的折线图，但是代码中存在 Bug 需要你去修复。准备步骤├── js│ └── echarts.js└── index.htmljs/echarts.js 是 ECharts 文件。index.html 是主页面。cd /home/projectwget https://labfile.oss.aliyuncs.com/courses/9791/03.zip && u
2025-02-06 23:56:31
1178
33
原创 【CSS——效果实现】展开你的扇子（蓝桥杯真题-2449）【合集】
网站上为了让内容显示不臃肿，我们可以做一个折叠展开的效果。本题将使用 CSS3 实现元素呈扇形展开的效果。准备步骤├── css│ └── style.css├── effect.gif└── index.htmlcss/style.css 是样式文件。effect.gif 是最终实现的效果图。index.html 是主页面。cd /home/projectwget https://labfile.oss.aliyuncs.com/courses/9791/02.zip &
2025-02-06 23:41:42
1089
18
原创 【Html.js——效果实现】网页 PPT（蓝桥杯真题-2418）【合集】
除了使用办公软件来制作 PPT，利用前端技术其实我们也可以制作一个在浏览器播放的 PPT，这样的 PPT 更加方便传播和查看，而且可以最大限度地利用前端技术的布局和交互能力。本题请实现一个讲授 HTML 基础知识的网页 PPT。准备步骤├── css│ └── style.css├── effect.gif├── images│ ├── left-small.svg│ └── right-small.svg├── index.html└── js ├── index
2025-02-05 23:49:03
899
25
原创 【CSS3——页面布局】画一只考拉（蓝桥杯真题-2341）【合集】
CSS3 的 Flex 弹性布局和 Grid 网格布局已经成为前端页面排版的主流选择。本次挑战将使用这两种布局方式来画一只考拉。准备步骤├── styles.css└── index.htmlstyles.css 是页面样式文件。index.html 是页面布局结构。选中 index.html 右键启动 Web Server 服务（Open with Live Server），让项目运行起来。打开环境右侧的 Web 服务，就可以在浏览器中看到未完成的考拉。目标效果创造
2025-02-05 22:47:12
836
33
原创 【Html.js——随机密码生成器】不能说的秘密（蓝桥杯真题-2338）【合集】
密码生成器是一个实用的随机密码生成软件，有了它，你就不用绞尽脑汁想复杂的密码来守护你的个人隐私，只要动一下手指，一个新的密码就会生成。如此好用的工具，下面就让我们亲自动手来制作一个吧～这段 HTML 代码构建了一个简单的用户界面，用于实现随机密码生成器的交互部分。用户可以通过该界面设置密码的长度和包含的字符类型，然后点击按钮生成密码。这段 CSS 代码为 HTML 页面提供了样式，使页面具有美观的布局和视觉效果。目标效果生成的密码必须包含已选中的选项且只能由已选中的选项组成。特殊符号如下：!@#$
2025-02-02 23:37:14
717
14
原创 【JavaScript——函数设计】乾坤大挪移心法（蓝桥杯真题-2337）【合集】
六大派围攻光明顶，为解除明教危机，张无忌临危受命，在小昭的帮助下进入明教圣地拿到乾坤大挪移心法。在这关键时刻，心法因没有妥善保存长久暴露在空气中，部分字体已不可见，下面需要由你来设计心法帮助张无忌习得神功，战胜六大门派。准备步骤目标效果mentalMethod 需要返回一个函数，可以一直进行调用，但是最后一次调用不传参。函数通过以下方式执行，返回结果均为 '战胜峨眉,武当,少林'。mentalMethod('峨眉')('武当')('少林')();mentalMethod('峨眉','武当'
2025-02-02 23:14:03
931
3
原创 【Html.js——Bug修复】大电影（蓝桥杯真题-2333）【合集】
右键启动 Web Server 服务（Open with Live Server），让项目运行起来。请使用 jQuery 或者 js ，完成。文件中的 TODO 部分。准备步骤├── css│ └── style.css├── images├── index.html└── js └── jquery.min.jsindex.html 是主页面。js/jquery.min.js 是 jQuery 文件。images 是图片文件夹。css/style.css 是样式文件
2025-02-01 23:44:42
1161
41
原创 【Html.js——范围判定】偷梁换柱（蓝桥杯真题-2332）【合集】
随着医疗水平的进步，人的平均寿命在慢慢提升。现在全球平均预期寿命是 73.2 岁，而在 1950 年则只有 47 岁。那么人类的寿命有极限吗？根据最新的研究，人类寿命或超过 120 岁，达到 150 岁。因此，有关年龄的应用普遍将当今人类的合理年龄范围设置在 0 - 150 岁之间。那么，当一个年龄被录入，我们又是如何判断其是否合理的呢？准备步骤├── age.js└── index.htmlindex.html 是主页面。age.js 是需要补充代码的 js 文件。目标效果如果新属
2025-02-01 23:22:42
1090
12
原创 【Html.js——数据整理】平地起高楼（蓝桥杯真题-2328）【合集】
我们的国家国土面积十分的广阔，目前中国有 34 个省级行政区，包括 23 个省、5 个自治区、4 个直辖市、2 个特别行政区。其下面还有几千个县级区域，以及更多的乡镇区域。这样层层嵌套的省市区数据在实际开发中是如何处理的呢？下面请运用所学，解开这个谜团吧～准备步骤├── convert-to-tree.js└── index.htmlindex.html 是主页面。convert-to-tree.js 是需要补充代码的 js 文件。目标效果[ { id: "51", //
2025-01-31 23:42:50
1443
27
云创科技服务中心综合性科技服务创业计划书
2024-12-21
Html.js文件怎么移植为Vue.js文件
2024-12-15
TA创建的收藏夹 TA关注的收藏夹
TA关注的人