<!DOCTYPE html>
<html>
<head>
<title>Task 1.1</title>
<script>
function greeting() {
alert("Hello!");
}
</script>
</head>
<body onload="greeting();">
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<title>Task 1.2</title>
<script>
function greeting() {
var s;
s = "Hello";
alert(s);
}
</script>
</head>
<body onload="greeting();">
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<title>Task 1.3</title>
<script>
function greeting() {
var s;
s = "Hello";
document.getElementById("message").innerHTML = s;
}
</script>
</head>
<body onload="greeting();">
<div id="message"></div>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<title>Task 1.4</title>
<script>
function greeting() {
var s, x;
s = "8";
x = 8;
document.getElementById("message1").innerHTML = s + s + x;
document.getElementById("message2").innerHTML = s + (x + x);
document.getElementById("message3").innerHTML = s + x + s;
}
</script>
</head>
<body onload="greeting();">
<div id="message1"></div>
<div id="message2"></div>
<div id="message3"></div>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<title>Task 1.5</title>
<script>
function greeting() {
var firstname;
firstname = prompt("What is your first name?");
document.getElementById("message").innerHTML = "Hello " + firstname + "!";
}
</script>
</head>
<body onload="greeting();">
<div id="message"></div>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<title>Task 2.1</title>
<script>
function greeting() {
var firstname, lastname;
firstname = prompt("What is your first name?");
lastname = prompt("What is your last name?");
var output = "Hello " + lastname + " " + firstname + "!<br/><br/>";
output += "Different ways to display your name:<br/>";
output += firstname + " " + lastname + "<br/>";
output += lastname + ", " + firstname;
document.getElementById("message").innerHTML = output;
}
</script>
</head>
<body onload="greeting();">
<div id="message"></div>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<title>Task 2.2</title>
<script>
function addFruit() {
var fruit, s;
s = document.getElementById("fruit").innerHTML;
fruit = prompt("Enter a fruit that you like");
// Checks if user actually entered something
if (fruit !== null && fruit !== "") {
document.getElementById("fruit").innerHTML = "<li>" + fruit + "</li>" + s;
}
}
function clearFruits() {
document.getElementById("fruit").innerHTML = "";
}
</script>
</head>
<body>
<h2>
My favorite fruits
<span style="cursor:pointer; color:blue;" onclick="addFruit();">[Add]</span>
<span style="cursor:pointer; color:red;" onclick="clearFruits();">[Clear]</span>
</h2>
<ul id="fruit"></ul>
</body>
</html>