Defining a Simple Function and Function Calls
<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<title>Defining a Simple Function and Function Calls</title>
<script>
window.onload = function () {
document.getElementById('btnGreet').addEventListener('click', greeting);
}
function greeting() {
var resultDiv = document.getElementById('result');
resultDiv.innerHTML = "<h1>greetings!</h1>";
}
</script>
</head>
<body>
<div id='result'></div>
<button id="btnGreet">Greet Me</button>
</body>
</html>
Top
Index
<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<title>Function Parameters</title>
<script>
window.onload = function () {
calculateDogYears(6);
calculate(257, 63, 10);
}
function calculateDogYears(ageInHumanYears) {
var dogYears = ageInHumanYears * 7;
document.getElementById('result').innerHTML = "<h1>" + dogYears + " dog years</h1>";
}
function calculate(atBats, hits, walks) {
var ba = Math.floor(hits / (atBats - walks) * 1000) / 1000;
document.getElementById('result').innerHTML += "<br/><h1>" + ba + " batting average</h1>";
}
</script>
</head>
<body>
<div id='result'></div>
</body>
</html>
Top
Index
<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<title>The Return Statement</title>
<script>
window.onload = function () {
var x = 215;
var y = 115.5;
var sum = addThese(x, y);
document.getElementById('result').innerHTML = sum;
document.getElementById('result').innerHTML += '<br/>' + multiplyThese(x, y);
document.getElementById('result').innerHTML += '<br/>' + subtractThese(x, y);
}
function addThese(a, b) {
var c = a + b;
return c;
}
function subtractThese(a, b) {
var c = a - b;
return c;
}
function multiplyThese(a, b) {
var c = a * b;
return c;
}
</script>
</head>
<body>
<div id='result'></div>
</body>
</html>
Top
Index
<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<title>Anonymous Function</title>
<script>;
window.onload = function () {
var btnPress = document.getElementById('myButton');
btnPress.addEventListener('click', function () {
alert("button pressed");
});
}
</script>
</head>
<body>
<div id='result'></div>
<button id="myButton">Press Me</button>
</body>
</html>
Top
Index