随机生成字母

目录

css代码

html代码

js代码


css代码

     .box {width: 400px;height: 400px;background-color: #797979;margin: 100px auto;padding-top: 100px;}.text{width: 200px;height: 50px;outline: none;border: 5px solid #545454;background-color: #797979;border-radius: 10px;font-size: 40px;margin: 0 auto;}button {color: white;background-color: #a955fe;outline: none;border: none;width: 60px;height: 30px;border-radius: 15px;}span {display: inline-block;width: 100px;height: 50px;border: 5px solid #f93200;background-color: white;font-size: 40px;}p {text-align: center;}

html代码

 <div class="box"><p class="text"></p><p><button>开始</button><button>停止</button></p><p>您的选择是:<span></span></p></div>

js代码

  const text = document.querySelector('.text')const btn = document.querySelectorAll('button')const span = document.querySelector('span')function Random(n, m) {if (n > m) {let temp = nn = mm = temp}return Math.floor(Math.random() * (m - n + 1)) + n}let arr = ['a', 'b', 'c', 'd', 'e', 'f', 'h', 'i', 'l', 'j', 'k', 'm', 'l', 'n', 'q', 'r', 'u', 'y', 'o', 'p', 'x', 'z', 's', 'v', 't', 'w']let timerbtn[0].addEventListener('click', function () {timer = setInterval(function () {let random =Random(0,arr.length-1)text.innerHTML = arr[random]}, 60)})btn[1].addEventListener('click', function () {clearInterval(timer)span.innerHTML=text.innerHTML})

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

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

相关文章

5G NSA注册解析及图标显示方案

5G NSA注册解析及图标显示方案 1. NSA注册流程解析1.1 NSA注册流程1.2 NAS消息信元变化1.3 UE能力信元变化1.3.1 第一次UE能力查询1.3.2 后续UE能力查询1.3.3 UE能力过滤器解析 1.4 UE测量配置1.5 SCG添加消息解析1.6 SCG添加成功1.7 Split Bearer承载的建立1.8 NR协议查询索引…

python动态规划求解最长回文子串

回文是什么&#xff0c;回文是正着读和反着读都是一样的字符叫着回文。  如 ‘aba’&#xff0c;‘aa’&#xff0c;‘b’&#xff0c;这些都是回文 class Solution:def longestPalindrome(self,s: str) -> str:n len(s)dp [[False] * n for _ in range(n)]ans "…

微信公众号快速接入大模型

今天找到一个可以快速将大模型接入公众号的方法&#xff0c;现在跟大家分享一下。 如何让微信公众号接入大模型文案创作能力&#xff0c;实现类似ChatGPT文案创作功能。方法其实很简单&#xff0c;只需打开地址“http://www.botaigc.cn:8900/mpauth”&#xff0c;用微信扫码即可…

应用程序安装异常(-113)

应用程序安装异常(-113) 报错如下&#xff1a;    应用未安装:应用与您的手机不兼容。    应用程序安装异常(-113)    这种情况是说我们的是x86架构&#xff0c;但是你运行的项目支持的是arm架构&#xff0c;所以你需要让自己的项目也支持arm的架构。 方案一 在项目的…

redis运维(二十)redis 的扩展应用 lua(二)

一 redis 的扩展应用 lua redis lua脚本语法 ① 什么是脚本缓存 redis 缓存lua脚本 说明&#xff1a; 重启redis,脚本缓存会丢失 下面讲解 SCRIPT ... 系列 SCRIPT ② LOAD 语法&#xff1a;SCRIPT LOAD lua代码 -->载入一个脚本,只是预加载,不执行思考1&#xff1…

Praat脚本-038 | 批量替换标注TextGrid里的换行符

目录 引题获取脚本运行脚本知识引申关注版权说明 引题 我们在做标注的时候&#xff0c;可能会犯这样一个小错误&#xff0c;就是在标注的内容中间不小心进行了换行&#xff0c;大概会成为这个样子。 这样会有什么问题呢&#xff1f;在提取数据的时候&#xff0c;你会发现&…

群晖NAS基础设置

群晖NAS基础设置 最近一直在玩群晖NAS系统&#xff0c;有一些基础的配置跟大家分享一下 开启ssh登录 1.开启方法 控制面板—>终端和SNMP—>终端机 2.使用ssh软件登录 这里我用SecureCRT登录 进入ssh 3.进入root用户 starstar-nas:~$ sudo su -l root Password: ro…

【React】打包体积分析 source-map-explorer

通过分析打包体积&#xff0c;才能知道项目中的哪部分内容体积过大&#xff0c;方便知道哪些包需要进一步优化。 使用步骤 安装分析打包体积的包&#xff1a;npm i source-map-explorer在 package.json 中的 scripts 标签中&#xff0c;添加分析打包体积的命令对项目打包&…

cocos游戏引擎制作的滚动框地图防止误点操作的简单方法

本篇文章主要讲解&#xff0c;使用cocos creator 来解决在我们日常滚动框开发中&#xff0c;滚动和触摸存在冲突的情况&#xff0c;导致的误触行为的解决办法。 日期&#xff1a;2023年11月25日 具体事项 说明&#xff1a;在我们滚动滚动框时&#xff0c;会出现误点的情况&…

flink源码分析之功能组件(二)-kubeclient

简介 本系列是flink源码分析的第二个系列,上一个《flink源码分析之集群与资源》分析集群与资源,本系列分析功能组件,kubeclient,rpc,心跳,高可用,slotpool,rest,metrics,future。其中kubeclient上一个系列介绍过,为了系列完整性,这里“copy”一下。 kubeclient组件…

Vue3框架中让table合计居中对齐

第一步&#xff1a;给它加一个类名 center-table 如下&#xff1a; <el-table:data"datas.shows"max-height"600px"show-summarystripeborderstyle"width: 100%":header-cell-style"{ textAlign: center }":cell-style"{ text…

别再被面试官问倒了!快速失败与安全失败的区别详解

大家好&#xff0c;我是小米&#xff0c;一个热爱技术分享的程序员大哥哥。今天&#xff0c;我们来聊一个在Java面试中经常会被问到的问题——"快速失败"&#xff08;fail-fast&#xff09;和"安全失败"&#xff08;fail-safe&#xff09;的区别。这两个概…