アプリ

四則演算・・サイトのもの

投稿日:

html

<div>
<input type="text" id="num1">
<input type="text" id="num2">
<button type="button" id="add-button">+</button>

<div id="box">
</div>

js

//後で四則演算するために 例えばA+BのAなどもととなる関数を作ります。
//htmlでnum1に入力されたものを数値に変換する関数を作り、それをgetNum1とする
function getNum1(){
 return parseFloat(document.getElementById('num1').value)
 };
function getNum2(){
return parseFloat(document.getElementById('num2').value)
};

//次は合計値を出す

function showResult(num){
 document.getElementById('box').innerHTML=num
};
//document.getElementById('box').textContent=num これでもいいがIE未対応

自分なりの解釈としては、
まず、ボックスのテキストを書き換える関数であり、numで書き換える
ではnumは何かというと
function名(○○) この○であるということ

よって、↓でfunction名の中身をresultとして、
resultは足し算の変数
それがfunctionの引数になっているということ?

document.getElementById('add-button').onclick=function(){
const result =getNum1() + getNum2();
showResult(result);
};
↑これだと結合になってしまうので、パースイントを使う

 

-アプリ

Copyright© プログラミング , 2020 All Rights Reserved.