消費税計算③

概要

①inputタブのid属性に入力した値をインプット
②JS側で計算（加工）今回は消費税の計算になります。
③テーブルタグに出力。

①HTML　インプット

index.html

<form>
    <label>式:</label>
    <input  type="tel" placeholder="価格を入力してください" id="number">
    <input class="btn" type="button" value="計算"id="count">
  </form>

テキスト、ボタンそれぞれにid属性を付けます。

②JS　加工、アウトプット

index.js

const reckoning = document.querySelector('[type="button"]');
      reckoning.addEventListener('click',e =>{
        function totalTax() {
          const taxNot = document.getElementById('number').value;
          console.log(taxNot);
          const total = Math.round(taxNot * (1+0.1)); 
          return total; 
        }
        const sub = totalTax();

        document.getElementById('total').textContent = sub;


      });

①ボタンを押す（イベント）発生
②テキストから値を取得(valueプロパティ　▶　フォームのインプットやtextareaの値や文字列を取得し、要素の中身を操作します。)
③Math.roundで小数点以下を四捨五入します。
④定数subに関数を呼び出す。
⑤テキストのid取得し、subを代入。
⑥テーブルに出力