The following JavaScript code is not specifically related to Tic-Tac-Toe, but rather serves a general purpose in checking for the presence of document.all and getElementById functions.
In today's world, both document.all (which lists all elements) and document.getElementById (a function that returns an element with a matching ID) are commonly available.
After checking for these functionalities, the code dynamically writes CSS styling information into the document using HTML tags.
<style>
.tictac{
width:50px;
height:50px;
}
</style>
To illustrate how it works, there is a snippet below where a div with a class of tictac is added and styled with a black background color.
Upon running the snippet, the size of the div is set to 50x50 pixels.
The code snippet includes additional logic:
A check to write CSS styles if either document.all or document.getElementById is present.
if (document.all||document.getElementById){
document.write('<style>.tictac{')
document.write('width:50px;height:50px;')
document.write('}</style>')
}
This also includes pre-defined CSS styles for the .tictac class:
.tictac{
background-color:#000;
}
And a sample usage of the styled div:
<div class="tictac">ABCD</div>