12345678910111213141516171819202122232425262728293031323334353637383940414243444546 |
- <!DOCTYPE html>
- <html lang="en">
- <head>
- <meta charset="UTF-8">
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
- <title>Table1</title>
- </head>
- <body>
- <script>
- function matrixTable() {
- var table = [];
- let tableInner = document.createElement("table")
- tableInner.setAttribute("border", "2")
-
- for(let i = 0; i < 10; i++) {
- var newrow = document.createElement("tr");
-
-
- table[i] = [];
- for(let j = 0; j < 10; j++){
- var newtd = document.createElement("td");
- newtd.onmouseover = function(){
- this.style = "background-color: #c4c0c0;"
-
- }
- newtd.onmouseout = function(){
- this.style = "background-color: none; border: 2px solid black; width: 15px; height: 15px;"
-
- }
- newtd.style = "border: 2px solid black; width: 15px; height: 15px;"
- newtd.innerHTML = ((i) * j)
- let oneTd = newtd
- newrow.appendChild(oneTd)
- tableInner.appendChild(newrow)
- }
- document.body.appendChild(tableInner)
-
- }
-
- }
- matrixTable()</script>
- </body>
- </html>
|