web蓝桥杯真题--14、关于你的欢迎语

介绍

营销号,有时候需要一些特定的欢迎语,但针对特定的用户,我们希望可以个性化一点。本题需要在项目文件中修改代码存在的问题,实现根据模版生成特定用户的欢迎语。

准备

本题已经内置了初始代码,打开实验环境,目录结构如下:

├── css
│   ├── bootstrap.min.css
│   └── style.css
├── js
│   ├── bootstrap.bundle.min.js
│   └── index.js
└── index.html

其中:

  • css/style.css 是页面样式文件。
  • css/bootstrap.min.css 和 js/bootstrap.bundle.min.js 是 Bootstrap 相关文件。
  • js/index.js 是页面功能实现的逻辑代码。
  • index.html 是页面布局。

选中 index.html 右键启动 Web Server 服务(Open with Live Server),让项目运行起来。打开环境右侧的【Web 服务】,就可以在浏览器中看到如下错误显示,当前显示没有正确获取到输入的用户、课程、平台的输入框内容。

图片描述

目标

请修复 index.js 文件中存在的 bug,修复完成后,在表单的对应输入框中输入以下内容:

图片描述

页面效果如下所示:

图片描述

规定

  • 请严格按照考试步骤操作,切勿修改考试默认提供项目中的文件名称、文件夹路径等。
  • 满足题目需求后,保持 Web 服务处于可以正常访问状态,点击「提交检测」系统会自动判分。

解题思路:

首先这个题目考虑的是两个问题

一个是能否正确的获取到value值,我刚开始就是忽略这里了

    subject = document.getElementById("subject").value;

第二点就是看会不会模板字写法了,(还有别的方法,我会这个)模板字面量是一种特殊的字符串表示方法,它可以在字符串中插入变量、表达式或函数调用,并且保留换行符和空格。

    result = `欢迎用户${subject}在${event2}学习${event1}课程!`;

另外一定要注意这里的在***学习是event2,学习的***课程才是event1,刚开始没注意,太粗心了,这要是考试就废了

整体代码:

function generate() {
    subject = document.getElementById("subject").value;
    event1 = document.getElementById("event1").value;
    event2 = document.getElementById("event2").value;
    if (subject.length==0 || event1.length==0 || event2.length==0){
        return;
    }
    result = `欢迎用户${subject}在${event2}学习${event1}课程!`;
   // result = "欢迎用户subject在event学习event1课程!";
    document.getElementById("result").value = result;
}

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mfbz.cn/a/346495.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

Unity读书系列《Unity3D游戏开发》——拓展编辑器(一)

文章目录 前言一、扩展Project视图1、右键扩展菜单(Asset)2、监听事件3、拓展布局 二、扩展Hierarchy视图1、拓展菜单(GameObject)2、拓展布局3、重写菜单 三、扩展Inspector视图1、扩展原生组件2、扩展继承组件 四、扩展Scene视图…

redis-持久化-1

Redis 提供了2个不同形式的持久化方式。 RDB(Redis DataBase) AOF(Append Of File) 一、Redis持久化之RDB 1.什么是RDB 在指定的时间间隔内将内存中的数据集快照写入磁盘, 也就是行话讲的Snapshot快照&#xff0c…

Windows10上通过MSYS2编译FFmpeg 6.1.1源码操作步骤

1.从github上clone代码,并切换到n6.1.1版本:clone到D:\DownLoad目录下 git clone https://github.com/FFmpeg/FFmpeg.git git checkout n6.1.1 2.安装MSYS2并编译FFmpeg源码: (1).从https://www.msys2.org/ 下载msys2-x86_64-20240113.exe &#…

JS高频面试题(下)

11. 线程和进程的区别 进程是资源分配的最小单元,线程是代码执行的最小单元。 一个应用程序可能会开启多个进程,进程之间数据不共享,一个进程内部可以开启多个线程,线程之间的数据可以共享的,所以多线程的情况下&…

Qt/QML编程之路:ListView实现横排图片列表的示例(40)

ListView列表,在QML中使用非常多,排列一个行,一个列或者一个表格,都会用到ListView。 ListView显示从内置QML类型(如ListModel和XmlListModel)创建的模型中的数据,或在C++中定义的从QAbstractItemModel或QAbstract ListModel继承的自定义模型类中的数据。 ListView有一…

搭建通讯猫类似的TCP服务端

最近需要一个公网的TCP服务端平台来做4G模组的发包测验,通讯猫(http://www.tongxinmao.com/App/Detail/id/1)貌似使用不了,就干脆在自己的腾讯云上搭建了简单的TCP服务端。 我们搭建可以在服务器上使用Python、Java、C#等语言自行编写服务器程序。 目前是…

element-ui 树形控件 通过点击某个节点,遍历获取上级的所有父节点和本身节点

1、需求&#xff1a;点击树形控件的某个节点&#xff0c;需要拿到它上级的所有父节点进行操作 2、代码&#xff1a; 树形控件代码 <el-tree:data"deptOptions"node-click"getVisitCheckedNodes"ref"target_tree_Speech"node-key"id&qu…

javaSSMmysql电影推荐系统03073-计算机毕业设计项目选题推荐(附源码)

目 录 摘 要 Abstract 第1章 前 言 1.1 研究背景 1.2 研究现状 1.3 系统开发目标 第2章 技术与原理 2.1 开发技术 2 2.2 ssm框架介绍 2 2.3 MySQL数据库 2 2.4 B/S结构 2 第3章 需求分析 3.1 需求分析 3.2 系统可行性分析 3.3 项目设计目标与原则 3.4…

阿里云 ACK 云原生 AI 套件中的分布式弹性训练实践

作者&#xff1a;霍智鑫 众所周知&#xff0c;随着时间的推移&#xff0c;算力成为了 AI 行业演进一个不可或缺的因素。在数据量日益庞大、模型体量不断增加的今天&#xff0c;企业对分布式算力和模型训练效率的需求成为了首要的任务。如何更好的、更高效率的以及更具性价比的…

数学建模常见算法的通俗理解(3)

11 Logistic模型&#xff08;计算是/否的概率&#xff09; 11.1 粗浅理解 我们有m张图片&#xff0c;并且获取了这些图片的特征向量的矩阵&#xff0c;我们需要判断这些图片中是否满足我们某个要求&#xff0c;如是否含有猫&#x1f431;这种动物。那么此时我们的每张图片传…

《统计学习方法:李航》笔记 从原理到实现(基于python)-- 第3章 k邻近邻法

文章目录 第3章 k邻近邻法3.1 k近邻算法3.2 k近邻模型3.2.1 模型3.2.2 距离度量3.2.3 k值的选择3.2.4 分类决策规则 3.3 k近邻法的实现&#xff1a;kd树3.3.1 构造kd树3.3.2 搜索kd树 算法实现课本例3.1iris数据集scikit-learn实例kd树:构造平衡kd树算法例3.2 《统计学习方法&a…

Docker中安装 RabbitMQ

1、下载 RabbitMQ 镜像 下载最新版本的镜像&#xff1a; docker pull rabbitmq更多版本的镜像可以访问 Docker 官网&#xff1a;https://hub.docker.com/_/rabbitmq?tabtags 2、创建并运行 RabbitMQ 容器 启动命令&#xff1a; docker run -d -p 15672:15672 -p 5672:567…

Netty Reactor 模式解析

目录 Reactor 模式 具体流程 配置 初始化 NioEventLoop ServerBootstrapAcceptor 分发 Reactor 模式 在刚学 Netty 的时候&#xff0c;我们肯定都很熟悉下面这张图&#xff0c;它就是单Reactor多线程模型。 在写Netty 服务端代码的时候&#xff0c;下面…

『OpenCV-Python|鼠标作画笔』

Opencv-Python教程链接&#xff1a;https://opencv-python-tutorials.readthedocs.io/ 本文主要介绍OpenCV-Python如何将鼠标作画笔绘制圆或者矩形。 示例一&#xff1a;图片上双击的位置绘制一个圆圈 首先创建一个鼠标事件回调函数&#xff0c;鼠标事件发生时就会被执行。鼠标…

php 文件上传

目录 1 php.ini 配置文件的修改 2.系统返回码详解 错误级别 4.上传简单示例 5.php代码简单优化 1 php.ini 配置文件的修改 配置项说明file_uploads on 为 开启文件上传功能&#xff0c; off 为关闭 post_max_size 系统允许的 POST 传参的最大值 &#xff0c;默认 8M upl…

(二十八)ATP应用测试平台——使用electron集成vue3桌面应用程序

前言 Electron 是一个开源的框架&#xff0c;它允许使用 Web 技术&#xff08;HTML、CSS 和 JavaScript&#xff09;构建跨平台的桌面应用程序。通过 Electron&#xff0c;开发者可以使用前端技术栈来创建具有原生应用程序体验的桌面应用。 Electron可以在 Windows、Mac 和 L…

爬虫是什么 怎么预防

爬虫是一种自动化程序&#xff0c;用于从网页或网站中提取数据。它们通过模拟人类用户的行为&#xff0c;发送HTTP请求并解析响应&#xff0c;以获取所需的信息。 爬虫可以用于各种合法用途&#xff0c;如搜索引擎索引、数据采集和监测等。然而&#xff0c;有些爬虫可能是恶意的…

【Web前端实操11】定位实操_照片墙(无序摆放)

设置一个板块&#xff0c;将照片随意无序摆放在墙上&#xff0c;从而形成照片墙。本来效果应该是很唯美好看的&#xff0c;就像这种&#xff0c;但是奈何本人手太笨&#xff0c;只好设置能达到照片墙的效果就可。 代码如下&#xff1a; <!DOCTYPE html> <html lang&…

使用dcdiag 和 netdiag确保域控的复制和网络是健康的

dcdiag 和 netdiag 是 Windows 操作系统中的两个命令行工具&#xff0c;主要用于诊断和验证活动目录&#xff08;Active Directory&#xff09;环境的健康状况&#xff0c;包括复制、连接以及其他网络服务。 以下是如何运行这两个工具的步骤&#xff1a; 运行 dcdiag&#xf…

PMP考试刷题记录20240125

1、所有干系人都在开会讨论一个新项目&#xff0c;该项目预计将在一个月内启动&#xff0c;并持续至少10次迭代&#xff0c;其中一个干系人提到应该有人负责开发和维护产品路线图。谁应该承担这个责任? A.项目经理 B.开发团队 C.ScrumMaster D.产品负责人 答案&#xff1…
最新文章