Creé tres cuadros de texto.
<html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <script src="7.js"></script> <title>Document</title> </head> <body> <input type="text" name="" id="text1"> <input type="text" name="" id="text2"> <label for="color">Which cell to color</label> <input type="text" name="" id="color"> <input type="button" value="Generate" onclick="h()"> <br> <!--javascript code--> <script> function h(){ var a=document.getElementById("text1").value; var b=document.getElementById("text2").value; var col=document.getElementById("color").value; var g=parseInt(col); document.write("<table border='1'>"); var c=1; for(i=0;i<a;i++) { document.write("<tr>"); for(j=0;j<b;j++) { document.write("<td>",c++,"</td>"); } document.write("</tr>"); } document.write("</table>"); } </script> </body> </html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <script src="7.js"></script> <title>Document</title> </head> <body> <input type="text" name="" id="text1"> <input type="text" name="" id="text2"> <label for="color">Which cell to color</label> <input type="text" name="" id="color"> <input type="button" value="Generate" onclick="h()"> <br> <!--javascript code--> <script> function h() { var a = document.getElementById("text1").value; var b = document.getElementById("text2").value; var col = document.getElementById("color").value; var g = parseInt(col); document.write("<table border='1'>"); var c = 1; for (i = 0; i < a; i++) { document.write("<tr>"); for (j = 0; j < b; j++) { if (parseInt(col) == c) { console.log(col) document.write("<td style='background-color: yellow;'>", c++, "</td>"); } else { document.write("<td>", c++, "</td>"); } } document.write("</tr>"); } document.write("</table>"); } </script> </body> </html>establecer el fondo de todas las td n-ésima posición
<html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <script src="7.js"></script> <title>Document</title> </head> <body> <input type="text" name="" id="text1"> <input type="text" name="" id="text2"> <label for="color">Which cell to color</label> <input type="text" name="" id="color"> <input type="button" value="Generate" onclick="h()"> <br> <!--javascript code--> <script> function h(){ var a=document.getElementById("text1").value; var b=document.getElementById("text2").value; var col=document.getElementById("color").value; var g=parseInt(col); document.write("<table border='1'>"); var c=1; for(i=0;i<a;i++){ document.write("<tr>"); for(j=0;j<b;j++){ var background = ''; if(g == j){ background = 'style="background-color:red"'; } document.write("<td "+background+">",c++,"</td>"); } document.write("</tr>"); } document.write("</table>"); } </script> </body> </html>