Change the style, "display" attribute, of a canvas in Javascript

Question

I have a Javascript function that takes an empty canvas and fills it. Only that, as in a first moment I do not want to display the canvas, I set her style in the display attribute as "None". Now, I change the display to block (at runtime). How could I do this in Javascript?

This is the canvas in my html:

<canvas class="canvasCentral" id="bordas" width="400" height="500">

    </canvas>

The style applied to canvas is the "canvasCentral" class of a css file linked to my html:

.canvasCentral{
        position:absolute;
        top:50%;
        left:50%;
        transform:translate(-50%,-50%);
        border:3px solid #D8D8D8;
        border-radius: 20px;
        display:none

    }

How could I, in Javascript, at runtime change the canvas display to block?

Answer 1

You can pick it up by the id

document.getElementById('bordas').style.display = "block";

Or by class (if you want to change to all elements that use this class)

var elementos = document.getElementsByClassName("canvasCentral");
elementos.forEach(alteraDisplay)

function alteraDisplay(item, index) {
    item.style.display = "block";
}