Maison > Article > interface Web > Comment résoudre quelques problèmes de calcul simples avec JS
Comment résoudre quelques problèmes de calcul simples avec JS
- 小云云original
- 2018-02-26 09:06:401555parcourir
La fonction de js est très puissante. Cet article vous explique principalement comment résoudre quelques problèmes de calcul simples avec JS. J'espère que cela pourra vous aider.
Jetons d'abord un coup d'œil à l'effet après l'opération :
Ensuite, nous partagerons avec vous tout le code :
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>document</title>
<style type="text/css">
/*计算器的style*/
.jisuanqi {
width: 270px;
height: 200px;
border: 1px solid black;
list-style-type: none;
background: #C9E495;
margin: 10px 0px 10px 0px;
}
.jisuanqi span {
width: 20px;
height: 10px;
margin-right: 5px;
}
.jisuanqi input {
margin-bottom: 5px;
}
[name=yunsuanfu] {
width: 50px;
height: 30px;
margin-left: 10px;
}
/*一元二次函数求根style*/
.box {
width: 300px;
height: 200px;
border: 1px solid black;
text-align: center;
background: #C9E495;
}
.box input {
margin-bottom: 10px;
}
</style>
<script type="text/javascript">
//计算10-100之和
function Sum(){
var i=0;
for (var j=10;j<=100;j++){
i+=j;
}
document.getElementById("count").value=i;
}
//判断是否闰年
function Runnian() {
var year = document.getElementById("year").value;
if (year==""){
alert("请先输入年份");
}
else if (year<=0){
alert("请输入大于0的年份");
}
else if ((year % 4 == 0) && (year % 100 != 0 || year % 400 == 0)){
document.write(year+"是闰年"+"\n");
document.write("<a href=''>返回重新输入</a>")
}
else{
document.write(year+"不是闰年"+"\n");
document.write("<a href=''>返回重新输入</a>")
}
}
//计算器1
function Calculate (){
var sum=0;
var num1 = parseFloat(document.getElementById("text1").value);
var num2 = parseFloat(document.getElementById("text2").value);
var sel = document.getElementById("select").value;
switch(sel){
case "+":sum=num1+num2;break;
case "-":sum=num1-num2;break;
case "*":sum=num1*num2;break;
case "/":sum=num1/num2;break;
default:sum="请输入数字选择运算符";break;
}
document.getElementById("jieguo").value = sum;
}
//计算器2
function Cal(count){
var sum;
var num1 = parseFloat(document.getElementById("text3").value);
var num2 = parseFloat(document.getElementById("text4").value);
switch(count){
case "+":sum=num1+num2;break;
case "-":sum=num1-num2;break;
case "*":sum=num1*num2;break;
case "/":sum=num1/num2;break;
}
document.getElementById("result").value = (sum.toFixed(2));
}
//计算一元二次函数根
function hanshu(){
var a=parseFloat(document.getElementById("txta").value);
var b=parseFloat(document.getElementById("txtb").value);
var c=parseFloat(document.getElementById("txtc").value);
var d=b*b-4*a*c
var r1=(-b+Math.sqrt(d))/(2*a);
var r2=(-b-Math.sqrt(d))/(2*a);
document.getElementById("txt1").value=(r1.toFixed(2));
document.getElementById("txt2").value=(r2.toFixed(2));
}
</script>
</head>
<body>
<!--第1题计算10到100之和-->
<input type="button" value="计算" onClick="Sum()" >
<input type="text" id="count" value="单击计算10-100之和">
<!--第2题判断是否为闰年-->
<p></p>
<p>判断是否为闰年：</p>
<input type="search" id="year" maxlength="4">
<input type="button" value="计算" onClick="Runnian()">
<!--第三题计算器-->
<p></p>
<input type="text" id="text1" size="5">
<select id="select">
<option value="">选择运算符</option>
<option value="+">+</option>
<option value="-">-</option>
<option value="*">*</option>
<option value="/">/</option>
</select>
<input type="text" id="text2" size="5">
<input type="button" value=" = " onClick = "Calculate()">
<input type="text" id="jieguo">
<!--计算器-->
<p class="jisuanqi">
<h2>购物简易计算器</h2>
<li><span>第一个数</span>
<input type="search" id="text3">
</li>
<li><span>第二个数</span>
<input type="search" id="text4">
</li>
<li>
<input type="button" value=" + " name="yunsuanfu" onClick="Cal('+')">
<input type="button" value=" - " name="yunsuanfu" onClick="Cal('-')">
<input type="button" value=" × " name="yunsuanfu" onClick="Cal('*')">
<input type="button" value=" ÷ " name="yunsuanfu" onClick="Cal('/')">
</li>
<li><span>计算结果</span>
<input type="search" id="result">
</li>
</p>
<p class="box">
<h3>分别输入abc求根</h3>
<input type="text" size="3" value="" id="txta">
<input type="text" size="3" value="" id="txtb">
<input type="text" size="3" value="" id="txtc">
<br />
<input type="button" value="求根" onClick="hanshu()">
<br />
<input type="text" size="7" id="txt1">
<input type="text" size="7" id="txt2">
</p>
</body>
</html>Recommandations associées :
Une question de calcul sur l'algorithme PHP.
code de calcul de probabilité simple js
js implémente la fonction de calcul de quatre opérations arithmétiques simples
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!
Déclaration：
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Article précédent：Partage d'exemples d'opérations d'animation parabolique JSArticle suivant：Partage d'exemples d'opérations d'animation parabolique JS