Code Golf Asked on October 27, 2021
This problem is a challenge that has to do with DOM manipulation at scale and overcoming some issues that may be inherent in dealing with the DOM.
This challenge will be scored based on fastest execution.
You must render one of the challenge levels in the Chrome web browser (84.0.4147.89 for standardization purposes) (submissions will need to be JavaScript functions for timing purposes):
Using JavaScript please complete the following:
table-n to each table where n is a zero based index of order of the table on the screen. If a table is nested within a table the parent would be N and the child would be N+1 with the next table being N+2.table-n-row-r where r is a zero based index of rows in the table represented by table-n.table-n-row-r-cell-c where c is a zero based index of cells in a row represented by table-n-row-r.At the end of the challenge the web page should still be able to be interacted through in the browser, and a call to document.getElementsByClassName('table-n-row-r-cell-c'); should return one and only one cell from the DOM.
Any method available to you as valid as long as:
document.getElementsByClassName('table-n-row-r-cell-c'); returns only one elementFor this example we’re using the easy level as input.
The abbreviated output in the DOM should be.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Code Golf Challenge</title>
</head>
<body>
<table class="table-0">
<thead>
<tr class="table-0-row-0">
<th class="table-0-row-0-cell-0">1</th>
...
</tr>
</thead>
<tbody>
<tr class="table-0-row-1">
<td class="table-0-row-1-cell-0">11</td>
<td class="table-0-row-1-cell-1">12</td>
...
</tr>
...
</table>
</body>
</html>
There are only <td> and <th> elements used as cell elements for the challenge.
As long as document.getElementsByClassName('table-n-row-r-cell-c'); returns an element with this class, we’re good to go.
All entries need to have an execution speed of under 40 seconds for at least one difficulty level to qualify.
Timing starts when your algorithm starts, but after the page has loaded completely as all elements must be available (the browser spinner has stopped spinning).
Calculate the runtime for your method by calling performance.now() before and and after your injection method, and subtracting the first from the second as in the example below.
let t0 = performance.now();
doSomething() // <---- The function you're measuring time for
let t1 = performance.now();
let totalTime = t1 - t0;
The entry that handles the highest difficulty within 40 seconds wins. Ties are broken by execution time at that difficulty.
function mark() {
var t = 0, tp = '';
var c = [], i = { r: 0, p: '', c: 0 };
var elements = document.body.getElementsByTagName('*');
var length = elements.length, index, v;
for (index = 0; index < length; ++index) {
v = elements[index];
switch (v.tagName) {
case 'TH':
case 'TD':
v.className = i.p + i.c++;
if (i.c == 10 && i.r == 10) {
i = c.pop();
}
continue;
case 'TR':
v.className = i.p = i.t + i.r++;
i.c = 0;
i.p += '-col-';
continue;
case 'TABLE':
v.className = tp = 'table-' + t++;
tp += '-row-';
c.push(i);
i = { t: tp, r: 0, p: '', c: 0 };
}
}
}
If your code runs more than 2s, you must do something wrong. I believe.
Answered by tsh on October 27, 2021
Get help from others!
Recent Questions
Recent Answers
© 2024 TransWikia.com. All rights reserved. Sites we Love: PCI Database, UKBizDB, Menu Kuliner, Sharing RPP