smig/odin-codespace
1
0
Fork 0
mirror of https://gitea.smigz.com/smiggiddy/odin-codeprojects.git synced 2025-06-28 04:45:36 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

added tictactoe.js

Browse source
This commit is contained in:
Smig Tech 2023-09-26 09:33:47 -04:00
parent 45d1442742
commit 1fcb68f4e4
5 changed files with 103 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

17
dom-exercise/index.html Normal file
View file

@ -0,0 +1,17 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<div class="container">
</div>
<button onclick="alert('Hello World')">Click Me</button>
<!-- the HTML file -->
<button id="btn">Click Me</button>
<script src="js/script.js"></script>
</body>
</html>

36
dom-exercise/js/script.js Normal file
View file

@ -0,0 +1,36 @@
const container = document.querySelector('.container');
const content = document.createElement('div');
content.classList.add('dynamic');
content.textContent = "This shit is added";
container.appendChild(content);
const paragraph = document.createElement('p');
paragraph.textContent = 'Hey, I\'m red';
paragraph.style.color = 'red';
container.appendChild(paragraph);
const headerThree = document.createElement('h3');
headerThree.textContent = "Hey, I'm blue h3!";
headerThree.style.color = 'blue';
container.appendChild(headerThree);
const newDiv = document.createElement('div');
newDiv.style.borderColor = 'black';
newDiv.style.backgroundColor = 'pink';
const innerHeader = document.createElement('h1');
innerHeader.textContent = "I'm in a div!";
const paragraphTwo = document.createElement('p');
paragraphTwo.textContent = "Me too!!!";
newDiv.appendChild(innerHeader);
newDiv.appendChild(paragraphTwo);
container.appendChild(newDiv);
// the JavaScript file
const btn = document.querySelector('#btn');
btn.addEventListener('click', () => {
alert("Hello World");
});