xto3na · November 28, 2015 14:30
diff --git a/JavaScript homework: area and volume of cylinder b/JavaScript homework: area and volume of cylinder
 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 <html xmlns="http://www.w3.org/1999/xhtml">
 <head>
    <title></title>
 	<style>
 		input {
 			width: 300px;
 			height: 30px;
 			font-size: 16px;
 		}
 		.result {
 			display: none;
 			font-size: 20px;
 			font-family: sans-serif;
 		}
 	</style>
 </head>
 <body>
 	<p>
 		<input id="radius" type="text" placeholder="Введите радиус цилиндра"/>
 	</p>
 	<p>
 		<input id="height" type="text" placeholder="Введите высоту цилиндра"/>
 	</p>
 	<p>
 		<input type="button" id="btn-calc" value="Произвести рассчет" />
 	</p>
 	<p class="result">
 		Объем цилиндра равен:
 		<span id="volume"> 
 		</span>
 		. А его площадь равна:
 		<span id="area"> 
 		</span>.
 	</p>
 	<script>
 		var calcCylinder = {
 			PI: 3.14,

 			getVolume: function (radius, height) {
 				var volumeOfCylinder = (calcCylinder.PI*radius*radius*height);
 				return volumeOfCylinder;
 			},

 			getArea: function (radius, height) {
 				var areaOfCylinder = (2*calcCylinder.PI*radius*(radius + height));
 				return areaOfCylinder;
 			}
 		};

 		var radiusOfCylinder = 0;

 		var heightOfCylinder = 0;

 		var btn = document.querySelector("#btn-calc");

 		var btnClickHandler = function () {
 			radiusOfCylinder = document.querySelector("#radius").value;
 			heightOfCylinder = document.querySelector("#height").value;
 			var volume = calcCylinder.getVolume(radiusOfCylinder, heightOfCylinder);
 			var area = calcCylinder.getArea(radiusOfCylinder, heightOfCylinder);
 			var spanVolume = document.querySelector("#volume");
 			var spanArea = document.querySelector("#area");
 			spanVolume.textContent = volume;
 			spanArea.textContent = area;
 			document.querySelector(".result").style.display = "block";
 		};

 		btn.addEventListener("click", btnClickHandler);
 	</script>
 </body>
 </html>
	<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
	<html xmlns="http://www.w3.org/1999/xhtml">
	<head>
	<title></title>
	<style>
	input {
	width: 300px;
	height: 30px;
	font-size: 16px;
	}
	.result {
	display: none;
	font-size: 20px;
	font-family: sans-serif;
	}
	</style>
	</head>
	<body>
	<p>
	<input id="radius" type="text" placeholder="Введите радиус цилиндра"/>
	</p>
	<p>
	<input id="height" type="text" placeholder="Введите высоту цилиндра"/>
	</p>
	<p>
	<input type="button" id="btn-calc" value="Произвести рассчет" />
	</p>
	<p class="result">
	Объем цилиндра равен:
	<span id="volume">
	</span>
	. А его площадь равна:
	<span id="area">
	</span>.
	</p>
	<script>
	var calcCylinder = {
	PI: 3.14,

	getVolume: function (radius, height) {
	var volumeOfCylinder = (calcCylinder.PIradiusradius*height);
	return volumeOfCylinder;
	},

	getArea: function (radius, height) {
	var areaOfCylinder = (2calcCylinder.PIradius*(radius + height));
	return areaOfCylinder;
	}
	};

	var radiusOfCylinder = 0;

	var heightOfCylinder = 0;

	var btn = document.querySelector("#btn-calc");

	var btnClickHandler = function () {
	radiusOfCylinder = document.querySelector("#radius").value;
	heightOfCylinder = document.querySelector("#height").value;
	var volume = calcCylinder.getVolume(radiusOfCylinder, heightOfCylinder);
	var area = calcCylinder.getArea(radiusOfCylinder, heightOfCylinder);
	var spanVolume = document.querySelector("#volume");
	var spanArea = document.querySelector("#area");
	spanVolume.textContent = volume;
	spanArea.textContent = area;
	document.querySelector(".result").style.display = "block";
	};

	btn.addEventListener("click", btnClickHandler);
	</script>
	</body>
	</html>