就是这个样的粗爆,手搓一个计算器:硬币翻转概率计算器

devtools/2024/11/15 15:01:58/

线上运行,可以直接打开:硬币翻转概率计算器(在线计算器

       作为程序员,没有合适的工具,就得手搓一个,PC端,移动端均可适用。废话不多说,直接上代码。

HTML:

<div class="calculator"><input id="n" min="1" step="1" type="number" placeholder="请输入翻转次数 n"> <input id="k" min="0" step="1" type="number" placeholder="请输入期望正面次数 k"><button class="button" onclick="calculateCoinProbability()">计算概率</button><div id="result" class="result">结果:P(X = k) =</div></div>

JS:

javascript">// 计算组合数 C(n, k)function combination(n, k) {if (k > n) return 0;let result = 1;for (let i = 0; i < k; i++) {result *= (n - i) / (i + 1);}return result;}// 计算硬币翻转的概率function calculateCoinProbability() {const n = parseInt(document.getElementById('n').value);const k = parseInt(document.getElementById('k').value);const p = 0.5;// 检查输入有效性if (isNaN(n) || isNaN(k) || n < 1 || k < 0 || k > n) {document.getElementById('result').innerText = "请输入有效的 n 和 k 值,且 0 ≤ k ≤ n";return;}// 计算概率const probability = combination(n, k) * Math.pow(p, k) * Math.pow(1 - p, n - k);document.getElementById('result').innerText = `结果:P(X = ${k}) = ${probability.toFixed(4)}`;}

 CSS:

.calculator {width: 100%;background-color: #333;color: white;padding: 20px;border-radius: 10px;box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
}label {display: block;margin-bottom: 10px;font-size: 16px;
}input, select {width: 100%!important;padding: 10px!important;margin-bottom: 20px;color: #000000; border-radius: 5px;border: 1px solid #555;font-size: 16px!important;background-color: #ffffff!important;
}button {width: 100%;padding: 10px;background-color: #007bff;color: white;border: none;border-radius: 5px;cursor: pointer;font-size: 16px;
}button:hover {background-color: orange;
}.result {font-size: 18px;margin-top: 20px;text-align: center;
}option {background-color: #ffffff;
}p {font-size: 18px;margin-top: 5px!important;
}


http://www.ppmy.cn/devtools/134188.html

相关文章

C++算法练习-day40——617.合并二叉树

题目来源&#xff1a;. - 力扣&#xff08;LeetCode&#xff09; 题目思路分析 题目&#xff1a;给定两棵二叉树 root1 和 root2&#xff0c;请合并这两棵树&#xff0c;即将 root2 中的每个节点合并到 root1 中&#xff0c;合并的规则是如果两个节点在同一位置&#xff08;即…

Linux——GPIO输入输出裸机实验

学习了正点原子Linux环境下的GPIO的输入输出的裸机实验学习&#xff0c;现在进行一下小结&#xff1a; 启动文件start.S的编写 .global _start .global _bss_start _bss_start:.word __bss_start.global _bss_end _bss_end:.word __bss_end_start:/*设置处理器进入SVC模式*/m…

技术整合与生态构建:Lyft与Mobileye引领自动驾驶新纪元

在科技日新月异的今天&#xff0c;自动驾驶技术正逐渐从科幻电影走进现实生活&#xff0c;成为出行服务领域的一股不可忽视的力量。近日&#xff0c;北美网约车巨头Lyft与自动驾驶技术领先者Mobileye宣布联手合作&#xff0c;共同推动自动驾驶汽车出行服务的广泛商业化进程。此…

数组的定义及打印

引入 上次讲到字符和字符串&#xff0c;二者可以打印到控制台&#xff0c;但是这样就让打印的内容固定了&#xff0c;那尝试改变一下——第一&#xff1a;单个的字符可以通过像int 、float那样定义变量&#xff0c;通过改变变量来改变打印内容&#xff1b;第二多个字符的字符串…

面试:TCP、UDP如何解决丢包问题

文章目录 一、TCP丢包原因、解决办法1.1 TCP为什么会丢包1.2 TCP传输协议如何解决丢包问题1.3 其他丢包情况&#xff08;拓展&#xff09;1.4 补充1.4.1 TCP端口号1.4.2 多个TCP请求的逻辑1.4.3 处理大量TCP连接请求的方法1.4.4 总结 二、UDP丢包2.1 UDP协议2.1.1 UDP简介2.1.2…

爬虫新姿势——使用Chrome Devtools写一个小说爬虫

目前&#xff0c;绝大部分的爬虫教程都是基于Python和Node.js。其实&#xff0c;只要有Chrome浏览器,使用Chrome F12打开的的Devtools就能随时随地轻轻松松写一个爬虫&#xff0c;完全不用装其它语言环境。今天就介绍一下只使用Chrome Devtools来爬取网站www.biqudu.com/31_317…

Wordpress常用配置,包括看板娘跨域等

一个Wordpress的博客已经搭建完成了&#xff0c;那么为了让它看起来更有人间烟火气一点&#xff0c;有一些常用的初始配置&#xff0c;这里整理一下。 修改页脚 页脚这里默认会显示Powered by Wordpress&#xff0c;还有一个原因是这里要加上备案信息。在主题里找到页脚&…

android framework ams/wms常见系统日志(main\system\events\crash,protoLog使用)

重要性 wms和ams的一些系统原生日志能够帮助我们快速定位问题日志分类 在日常framework工作中常见的日志类别如下: -b , --buffer= Request alternate ring buffer, ‘main’, ‘system’, ‘radio’, ‘events’, ‘crash’, ‘default’ or ‘all’. Additionally, ‘kerne…