“Disabling” an HTML table with Javascript

Question

I\'ve seen this done in a lot of sites recently, but can\'t seem to track one down. Essentially I want to \"disable\" an entire panel (that\'s in the form on an HTML table) whe

Answer 1

Disabling the inner elements of an HTML table can also be done using pointer-events CSS style as shown below:

table[disabled], table[disabled] input { pointer-events: none }

At any desired point in our JavaScript code logic, we can add disabled attribute to the parent table as shown below which will bring the CSS styling into effect:

let gameTable = document.getElementById('gameBoard');
gameTable.setAttribute('disabled', true);