0% found this document useful (0 votes)
2 views5 pages

Assignment 2.3

The document contains two HTML applications: an Income Tax Calculator and a Tic Tac Toe game. The Income Tax Calculator allows users to input their yearly income and calculates the tax based on defined brackets using JavaScript. The Tic Tac Toe game features a grid layout where players can click to place their marks, with functionality to check for a winner or a draw.

Uploaded by

love020weii
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
2 views5 pages

Assignment 2.3

The document contains two HTML applications: an Income Tax Calculator and a Tic Tac Toe game. The Income Tax Calculator allows users to input their yearly income and calculates the tax based on defined brackets using JavaScript. The Tic Tac Toe game features a grid layout where players can click to place their marks, with functionality to check for a winner or a draw.

Uploaded by

love020weii
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 5

ASSIGNMENT 2.

3 22bds0233
<!DOCTYPE html>
<html lang ="en">
<head>
<title>income tax calcultor</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<h4>INCOME TAX CALCULATOR</h4>
<form id="taxform">
<label for="income">Enter yearly income:</label><br>
<input type="number" id="income" name="income"><br><br>
<button type="button" onclick="calculatetax()">calculate
tax</button><br>
<label for="result">Income tax is:</label><br>
<input type="text" id="result" name="result"
readonly><br><br>
</form>
<script>
function calculatetax(){
const income=document.getElementById("income").value;
let tax=0;
if(income<=2000){
tax=0;
}
else if (income<=20000){
tax=(income-2000)*0.04;
}
else if (income<=40000){
tax=720+(income-2000)*0.08;
}
else if (income<=80000){
tax=2320+(income-4000)*0.16;
}
else if (income<=120000){
tax=8720+(income-8000)*0.24;
}
else {
tax=18320+(income-12000)*0.32;
}
document.getElementById("result").value=tax.toFixed(2);
}
</script>
</body>
</html>
Style.css
body{
background-color: bisque;
}
form{
margin:20px;
}
label{
display:block;
margin-bottom:5px;
}
input[type="text"]{
padding:8px;

}
button{
padding: 10px 20px;
background-color: rgb(187, 129, 42);
border: 30px;
cursor: pointer;
border-radius: 4px;
align-content: flex-end;
}
2. tic tac toe
<!DOCTYPE html>
<html lang="en">
<head>
<title>Tic Tac Toe</title>
<style>
.board {
display: grid;
grid-template-columns: repeat(3, 100px);
grid-template-rows: repeat(3, 100px);
gap: 2px;
margin: 20px auto;
}
.cell {
width: 100px;
height: 100px;
background-color: lightgray;
display: flex;
justify-content: center;
align-items: center;
font-size: 2em;
cursor: pointer;
}
.cell:hover {
background-color: lightblue;
}
</style>
</head>
<body>
<h1>Tic Tac Toe</h1>
<div class="board">
<div class="cell" id="cell0" onclick="cellClicked(0)"></div>
<div class="cell" id="cell1" onclick="cellClicked(1)"></div>
<div class="cell" id="cell2" onclick="cellClicked(2)"></div>
<div class="cell" id="cell3" onclick="cellClicked(3)"></div>
<div class="cell" id="cell4" onclick="cellClicked(4)"></div>
<div class="cell" id="cell5" onclick="cellClicked(5)"></div>
<div class="cell" id="cell6" onclick="cellClicked(6)"></div>
<div class="cell" id="cell7" onclick="cellClicked(7)"></div>
<div class="cell" id="cell8" onclick="cellClicked(8)"></div>
</div>

<script>
let currentPlayer = 'X';
let cells = document.querySelectorAll('.cell');
let winner = false;

function cellClicked(index) {
if (cells[index].innerText === '' && !winner) {
cells[index].innerText = currentPlayer;
if (checkWinner()) {
winner = true;
alert(currentPlayer + ' wins!');
} else if (checkDraw()) {
alert('It\'s a draw!');
} else {
currentPlayer = currentPlayer === 'X' ? 'O' : 'X';
}
}
}

function checkWinner() {
const winConditions = [
[0, 1, 2],
[3, 4, 5],
[6, 7, 8],
[0, 3, 6],
[1, 4, 7],
[2, 5, 8],
[0, 4, 8],
[2, 4, 6]
];

for (let condition of winConditions) {


if (cells[condition[0]].innerText !== '' &&
cells[condition[0]].innerText ===
cells[condition[1]].innerText &&
cells[condition[0]].innerText ===
cells[condition[2]].innerText) {
return true;
}
}
return false;
}

function checkDraw() {
for (let cell of cells) {
if (cell.innerText === '') {
return false;
}
}
return true;
}
</script>
</body>
</html>

You might also like