Indent your code!
Only use English
paivitys -> update -> though really this should be with a subject, so updateObjekt?
dataa -> data
arvvoja -> values
paivitaselekt -> updateSelection
ssellecct -> selectElement
oppttion -> option
infoarray -> infoArray
chosenid -> chosenId
choseninfo -> chosenInfo
Mutating built-in prototypes is not a good idea. It's not only inelegant, it can also lead to conflicts when other scripts on the page expect the prototypes to be unmutated. (It can even damage future attempts to integrate functionality officially, if enough sites use the bad code.)
Instead of using Element.prototype, create your own class, and put methods ...
There are a number of improvements you can make.
Reassigning global variables so that a particular function can proceed to use them (spriteSet, tileSet, tilemapList) is pretty strange. It would make a lot more sense if these were only passed as arguments to the functions that need them instead. In fact, since the tileSet isn't being used anywhere except ...
<body style="background: pink">
<p id="word" style="color: black">Bubble sort: visualization</p>
<button onclick=CreateBarPlot()>Generate data</button>
Always use const to declare variables - only use let when you must reassign. This keeps code readable, because then a reader of the code doesn't have to constantly keep in mind that a variable might be reassigned later. (If you use let but then don't reassign, it can still be confusing - in professional code, one might think "Why is let being used here? Was ...
Some things could be said about the HTML (no need for hr, border will do; those imgs should be background images on buttons; this is obviously a list; those smalls should be labels; way to many divs; ...) but let me focus on te JS as you are asking.
First thing that jumps out is the repetition. Each function basically does the same thing, but for a ...
There are 2 more ways to do this using css without the calculation. They are:
Make the position of parent relative and child absolute. Now, using the slots value, left and right properties can be easily calculated for child div which will place it properly. The entire logic is reduces to the following without adding any additional elements:
There were few places where you could have optimized your CSS:
1) As all inputs were having the same style. Instead of declaring style for each input separately, you could have declared the global style on input only.
2) As all labels were having the same style. You can just make a common class (I made form-container ) and put it on all rows and put the ...
Good job satisfying the requirements! Aside from the obvious repetition you asked about, the code seems like a good start. It uses const and let appropriately.
How can DRY principles be applied to this code?
You have a good start using components - e.g. TableFields but keep going with that approach: make a ...