练习地址:http://www.fgm.cc/learn/lesson3/02.html
这个比较简单,主要就是parseInt的使用。不多说了,代码如下:
HTML
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="utf-8">
<title>用parseInt解析数字,并求和</title>
<link rel="stylesheet" type="text/css" href="2_sum.css">
</head>
<body>
<div id="container">
<input type="text">+<input type="text">=<span>?</span><button>求和</button>
</div>
<script type="text/javascript" src="2_sum.js"></script>
</body>
</html>
CSS
#container {
width: 300px;
margin: 0 auto;
}
input {
width: 50px;
margin: 10px;
}
span {
padding: 10px;
}
JavaScript
window.onload = function() {
var btn = document.getElementsByTagName("button")[0];
var show = document.getElementsByTagName("span")[0];
btn.onclick = function() {
var num1 = document.getElementsByTagName("input")[0].value;
var num2 = document.getElementsByTagName("input")[1].value;
var result = parseInt(num1) + parseInt(num2);
show.innerText = result;
}
}