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.mzph.cn/news/646107.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

flutter-相关个人记录

1、flutter 安卓打包打包报错 flutter build apk -v --no-tree-shake-icons 2、获取华为指纹证书命令 keytool -list -v -keystore ***.jks 3、IOS项目中私有方法查找隐藏文件中 1、cd 项目目录地址 2、grep -r xerbla. "xerbla"为需要查找的关键字 3…

【秒剪】如何一键恢复至素材原长?

Step1:点击下方【剪辑】 Step2:点击【时长截取】 Step3:点击【恢复至原长】 Step4:点击【恢复所有片段到原长】

推荐一个还可以的windows ssh工具

1.下载 https://github.com/kingToolbox/WindTerm/releases 2.解压 3.使用 上传 下载都很快 比cmd窗口好用 当然和finalshell有点像

系统登录的时候的密码如何做到以加密的形式进行登录【java.security包下的api】工具类。

/** description: 将普通的publicKey转化得到一个RSAPublicKey* author: zkw* date: 2024/1/24 16:17* param: publicKey 普通的publicKey* return: RSAPublicKey 得到一个新的RSAPublicKey**/public static RSAPublicKey getPublicKey(String publicKey) throws NoSuchAlgorit…

vue中图片不显示问题 - vue中静态资源加载

文章目录 vue中图片不显示问题静态资源URL 转换规则webpack 静态资源处理 图片不显示问题问题描述解决办法1:使用require引入require is not defined 解决办法2:使用import引入解决办法3:将图片放进公共文件夹static或public vue中图片不显示…

《解锁R统计分析:深度探索R Commander图形界面》

💂 个人网站:【 海拥】【神级代码资源网站】【办公神器】🤟 基于Web端打造的:👉轻量化工具创作平台💅 想寻找共同学习交流的小伙伴,请点击【全栈技术交流群】 在数据科学与大数据技术的浪潮中,R…

基于Java的学生宿舍门禁信息管理系统的设计与实现(源码+lw+部署文档+讲解等

目录 前言 详细视频演示 具体实现截图 技术栈 后端框架SpringBoot 前端框架Vue 持久层框架MyBaitsPlus 系统测试 系统测试目的 系统功能测试 系统测试结论 代码参考 数据库代码参考 源码获取 前言 💗博主介绍:✌全网粉丝10W,CSDN特邀作者、…

【数据结构】数据结构初识

前言: 数据结构是计算存储,组织数据的方式。数据结构是指相互间存在一种或多种特定关系的数据元素的集合。通常情况下,精心选择的数据结构可以带来更高的运行或者存储效率。数据结构往往同高效的检索算法和索引技术有关。 Data Structure Vi…

H.264数据解析

什么是H.264 H264 是 MPEG-4 标准所定义的最新编码格式,同时也是技术含量最高、代表最新技术水平的视频编码格式之一,标准写法应该是H.264 H264 视频格式是经过有损压缩的,但在技术上尽可能做的降低存储体积下获得较好图像质量和低带宽图像…

劳特巴赫的基础使用(二)

一、基本介绍 LAUTERBACH是世界领先的微处理器开发工具厂商,成立于1979年,总部位于德国慕尼黑。 JTAG Debugger由PowerDebug和Debug Cable组成。PowerDebug是通用控制模块,支持所有Cable,没有License。Debug Cable绑定License&a…

26、江科大stm32视频学习笔记——I2C读写W25Q64

一、W25Q64简介 1、W25Q64的内存空间结构: 一页256字节,4K(4096 字节)为一个扇区,16个扇区为1块,容量为8M字节,共有128个块,2048 个扇区。 2、W25Q64每页大小由256字节组成,每页的256字节用一次页编程指…

保姆级:Palworld幻兽帕鲁32人服务器一键部署

创建幻兽帕鲁服务器1分钟部署教程,阿里云和腾讯云均推出幻兽帕鲁服务器服务器和部署教程,4核16G和4核32G配置可选,阿腾云atengyun.com分享1分钟自建幻兽帕鲁Palworld服务器教程: 幻兽帕鲁服务器创建教程 幻兽帕鲁服务器官方推荐…

【模拟通信】AM、FM等的调制解调

调制相关的概念 调制:控制载波的参数,使载波参数随调制信号的规律变化 已调信号:受调载波,含有调制信号的全部特征 调制的作用: 提高发射效率多路复用,提高信道利用率提高系统抗干扰能力 两种调制方式 线性调制&a…

​第20课 在Android Native开发中加入新的C++类

​这节课我们开始利用ffmpeg和opencv在Android环境下来实现一个rtmp播放器,与第2课在PC端实现播放器的思路类似,只不过在处理音视频显示和播放的细节略有不同。 1.压缩备份上节课工程文件夹并修改工程文件夹为demo20,将demo20导入到Eclipse或…

RBD —— 简介

目录 General workflow Tips RBD SOP inputs and outputs Clustering Importing a fractured object into DOPs RBD SOP support nodes Related SOPs Low-level SOPs 通常在刚体模拟中,希望实体对象会因某些碰撞或力而破碎;Houdini内大多数破碎…

C# Bitmap类学习1

Bitmap对象封装了GDI中的一个位图,此位图由图形图像及其属性的像素数据组成.因此Bitmap是用于处理由像素数据定义的图像的对象。 using System; using System.Collections.Generic; using System.ComponentModel; using System.Data; using System.Drawing; using …

教你如何低成本自建「幻兽帕鲁」服务器,快速一键部署

创建幻兽帕鲁服务器1分钟部署教程,阿里云和腾讯云均推出幻兽帕鲁服务器服务器和部署教程,4核16G和4核32G配置可选,阿腾云atengyun.com分享1分钟自建幻兽帕鲁Palworld服务器教程: 幻兽帕鲁服务器创建教程 幻兽帕鲁服务器官方推荐…

EF core连接数据库的前期完整配置流程-开发环境搭建

EF core连接数据库完整流程-开发环境搭建 前置:.net6 core webapi不勾选任何配置 声明:这里是以两个配置类来做的,一个T_Books表,一个T_Person表 Book:创建属性及类型 BookConfig:对创建的进行属性数据表…

66.Spring是如何整合MyBatis将Mapper接口注册为Bean的原理?

原理 首先MyBatis的Mapper接口核心是JDK动态代理 Spring会排除接口,无法注册到IOC容器中 MyBatis 实现了BeanDefinitionRegistryPostProcessor 可以动态注册BeanDefinition 需要自定义扫描器(继承Spring内部扫描器ClassPathBeanDefinitionScanner ) 重…

物业app开发实战:10大功能必备,打造智能社区生活

随着智能科技的快速发展,物业管理也逐渐迈入数字化时代。物业app开发成为了提升社区管理效率、改善居民生活质量的重要途径。在本文中,我将分享10大必备功能,帮助开发者打造智能社区生活的物业app。 1. 便捷的社区公告发布功能 通过物业app…