ecki/JavaScript-from-Beginner-to-Professional
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

cleanup

Browse Source
This commit is contained in:
Karan 2021-11-25 19:57:51 +05:30 committed by GitHub
parent 0eea0069ff
commit 5392772fcf
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 0 additions and 35 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

35
Chapter 10/element attributes
View File

@ -1,35 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<title>Complete JavaScript Course</title>
</head>
<body>
<div id="message"></div>
<div id="output"></div>
<script>
const message = document.querySelector("#message");
const myArray = ["Laurence", "Mike", "John", "Larry", "Kim", "Joanne", "Lisa", "Janet", "Jane"];
build();
addClicks();
function build() {
let html = "<h1>My Friends Table</h1><table>";
myArray.forEach((item, index) => {
html += `<tr class="box" data-row="${index+1}" data-name="${item}"><td>${item}</td>`;
html += `<td >${index + 1}</td></tr>`;
})
html += "</table>";
document.getElementById("output").innerHTML = html;
}
function addClicks() {
const boxes = document.querySelectorAll(".box");
boxes.forEach((el) => {
el.addEventListener("click", (e) => {
let temp = el.getAttribute("data-row");
let tempName = el.getAttribute("data-name");
message.innerHTML = `${tempName } is in row #${temp}`;
})
})
}
</script>
</body>
</html>