效果图:
实现代码:
<body>
<input id="input1" type="text">
+
<input id="input2" type="text">
<button id="btn"> = </button>
<span id="result"> </span>
<script>
var input1 = document.getElementById('input1');
var input2 = document.getElementById('input2');
var btn = document.getElementById('btn');
var result = document.getElementById('result');
btn.onclick = function(){
if(input1.value == '' && input2.value == ''){
result.innerHTML = 0;
}else if(input1.value == '' && input2.value != ''){
result.innerHTML = parseFloat(input2.value);
}else if(input1.value != '' && input2.value == ''){
result.innerHTML = parseFloat(input1.value);
}else
result.innerHTML = parseFloat(input1.value) + parseFloat(input2.value);
}
</script>
</body>
用到parseFloat,是因为input1.value和input2.value是字符串,要转换为浮点数或者整数。
看完有帮助的话,加个关注哦~