html
html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
<!--
/‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾\
| Created by Unknown Decoder |
| Please upvote and comment |
| Version 3.0 will be introduced soon |
| with more styling features |
\_____________________________________/
-->
<!DOCTYPE html>
<html>
<head>
<title>Custom Tables</title>
</head>
<body>
<h2>Table Generations:</h2>
No. of Rows:<input type=number id='rows'><br>
No. of Columns:<input type=number id='cols'><br>
<button onclick='generate()'>Generate Table</button><br><br>
<h2>Table Stylings:</h2>
Table Color:<select id='tableColor'>
<option value='White'>White</option>
<option value='Blue'>Blue</option>
<option value='Green'>Green</option>
<option value='Yellow'>Yellow</option>
<option value='Red'>Red</option>
<option value='Magenta'>Magenta</option>
<option value='Pink'>Pink</option>
Enter to Rename, Shift+Enter to Preview
css
css
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
/*
/‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾\
| Created by Unknown Decoder |
| Please upvote and comment |
| Version 3.0 will be introduced soon |
| with more styling features |
\_____________________________________/
*/
body {
button {
position:absolute;
right:10px;
}
hr {
height:5px;
background-color:black;
}
}
Enter to Rename, Shift+Enter to Preview
js
js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
/*
/‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾\
| Created by Unknown Decoder |
| Please upvote and comment |
| Version 3.0 will be introduced soon |
| with more styling features |
\_____________________________________/
*/
alert('Welcome to Table Generator! You can make your own table by defining rows and columns, and specifying styles (if you want)!')
alert('To change the cell contents, just click on the cell')
function generate() {
let decision = confirm('Are you sure you want to generate a new table? If you have made any interactions with the previous table, this process will erase them.')
if (decision === true) {
let rows = parseInt(document.getElementById('rows').value)
let cols = parseInt(document.getElementById('cols').value)
let table = document.getElementById('table');
table.innerHTML = ''
for (let i = 0; i < rows; i++) {
let row = table.insertRow(-1)
for (let j = 0; j < cols; j++) {
let cell = row.insertCell(-1)
cell.textContent = 'Null'
cell.onclick = function() {update(cell)}
}
Enter to Rename, Shift+Enter to Preview
BROWSER
Console
Run