html怎么读取输入框的值并进行运算

1、html:<h1>计算两个值之和</h1><input type="text" value=""/><span>+</span><input type="text" value=""/><span>=</span><span class="total"></span><button class="btn" onclick="total()">计算</button>

2、css:h1{ text-align: center; line-height: 20px; font-si芰垄孕动ze: 16px;}input { width: 30%; height: 20px; line-height: 20px; border: 1px solid #2994CA;}span{ display: inline-block; width: 10%; text-align: center;}.total{ color: red;}.btn{ width: 20%; background: #2994CA; color: #fff; margin: 20px auto; display: block; height: 30px; border-radius: 5px;}

3、js:function total(){ var number = 0; //获取所有的input,遍历获取值,进行相加 $("input").each(function(){ number += parseFloat($(this).val()); }); //将相加之和,显示到相应的位置 $(".total").html(number)}