There is a code, but I can not arrange the matrix in the form of a table, who could help with this?

  • 0
    `Code`

    <!DOCTYPE html>
    <html>
    <head>
        <link rel="stylesheet" href="css/4.25.css">
        <link rel="shortcut icon" href="../images/hanzopog.png" type="image/png">
        <title>4.25</title>
    </head>
    <body>
    
        <pre align="center" class="text_of_task"><font size="5" face="arial">Задача: Дана прямоугольная целочисленная матрица размера m строк и n столбцов.
            Последовательность элементов матрицы, расположенных по чётным строкам слева направо,
            по нечётным строкам справа налево, (строки рассматриваем последовательно сверху
            вниз) назовем «змейкой». Сдвинуть циклически элементы змейки на одну позицию к
            концу.</pre></font>
    
    
        <form action="../index.html">
            <button type="submit" class="button_start">Перейти на главную страницу</button>
        </form>
        <div class="divblock125">
    
        <p><font size="6" color="black" face="Arial">
            <br><br><button type="button" class="button" id="count">Вывод ответа</button></p></font></br>
        
        <style> 
    
            .button{
                background:#fff;
                width:225px;
                display:block;
                height:33px;
                padding-top:5px;
                border:1px solid cyan;
                margin: 20px auto;
                font-family: 'Dosis', sans;
                font-size: 18px;
                font-weight:200;
                color:#000;
                text-transform:uppercase;
                text-decoration:none;
                text-align:center;
                opacity:.8;
                letter-spacing: 1px;
                    -webkit-transition: all 300ms cubic-bezier(0.250, 0.250, 0.750, 0.750);
                -moz-transition: all 300ms cubic-bezier(0.250, 0.250, 0.750, 0.750);
                    -o-transition: all 300ms cubic-bezier(0.250, 0.250, 0.750, 0.750);
                        transition: all 300ms cubic-bezier(0.250, 0.250, 0.750, 0.750); /* linear */
            }
            .button:hover{
                width:225px;
                height:33px;
                padding-top:5px;
                border:1px solid teal;
                margin: 20px auto;
                opacity:1;
                letter-spacing: 4px;
                -webkit-transition: all 300ms cubic-bezier(0.250, 0.250, 0.750, 0.750);
                -moz-transition: all 300ms cubic-bezier(0.250, 0.250, 0.750, 0.750);
                    -o-transition: all 300ms cubic-bezier(0.250, 0.250, 0.750, 0.750);
                        transition: all 300ms cubic-bezier(0.250, 0.250, 0.750, 0.750); /* linear */
            }
    
            input[type=text] {
                width: 100%;
                padding: 12px 20px;
                margin: 8px 0;
                box-sizing: border-box;
                border: 1px solid #555;
                outline: none;
            }
            
            input[type=text]:focus {
                background-color: lightblue;
            }
    
            </style>
    
        <font size="5" face="Arial">
            <div class="ishodnaya" id="ishodnaya"></div>
            <div class="otvet" id="otvet"></div>
        </font>
    
        
        <script>
            
            const m = 6;//строки
            const n = 6;//столбцы
    
            var a = new Array();
    
            c = 1;
    
            for (i = 0; i < m; i++)
            {
                var tmp = new Array()
                if (i % 2 == 0)
                {
                    for (j = n - 1; j >= 0; j--)
                    {
                        tmp[j] = c;
                        c++;
                    }
                }
                else
                {
                    for (j = 0; j < n; j++)
                    {
                        tmp[j] = c;
                        c++;
                    }
                }
                a[i] = tmp;
            }
            function matrix(){
                console.log("Исходная матрица");
                for (i = 0; i < m; i++)
                {
                    console.log(a[i])
                    //alert('Исходная матрица: ' + a[i])
                    //document.getElementById('ishodnaya').innerHTML = "исходная матрица: " + a[i];
                    
                    var arr=a
                    var c = 10; // изменяемый параметр количества элементов в чанке
                    var new_arr = [];
                    for (i=0; i<arr.length; i+=c) {
                        new_arr.push(arr.slice(i,i+c));
                    }
                    html = '<table>';
                    for(i=0; i<c; i++){
                        html+='<tr>';
                        for(j=0;j<arr.length/c;j++){
                            if(typeof new_arr[j][i] != 'undefined'){
                                html+='<td>'+new_arr[j][i]+'</td>';
                            }
                        }
                        html+='</tr>';
                    }
                    document.getElementById('ishodnaya').innerHTML = "Исходная Матрица:" + html
    
    
                }
                if (m % 2 == 1)
                    c = a[m - 1][0];
                else c = a[m - 1][n - 1];
                s = c;
                for (i = m - 1; i > 0; i--)
                {
                    if ((i + 1) % 2 == 1)
                    {
                        for (j = 0; j < n - 1; j++)
                        {
                            a[i][j] = a[i][j + 1];
                        }
                        a[i][n - 1] = a[i - 1][n - 1];
                    }
                    else {
                        for (j = n - 1; j > 0; j--)
                            a[i][j] = a[i][j - 1];
                        a[i][0] = a[i - 1][0];
    
                    }
                }
                for (j = 0; j < n - 1; j++)
                {
                    a[0][j] = a[0][j + 1];
                }
                a[0][n - 1] = c;
    
                console.log("Ответ")
                for (i = 0; i < m; i++)
                {
                    console.log(a[i]);
                    //alert('Ответ: ' + a[i]);
                    //document.getElementById('otvet').innerHTML = "ответ: " + a[i];
    
                    var arr=a
                    var c = 10; // изменяемый параметр количества элементов в чанке
                    var new_arr = [];
                    for (i=0; i<arr.length; i+=c) {
                        new_arr.push(arr.slice(i,i+c));
                    }
                    html = '<table>';
                    for(i=0; i<c; i++){
                        html+='<tr>';
                        for(j=0;j<arr.length/c;j++){
                            if(typeof new_arr[j][i] != 'undefined'){
                                html+='<td>'+new_arr[j][i]+'</td>';
                            }
                        }
                        html+='</tr>';
                    }
                    document.getElementById('otvet').innerHTML = "Ответ(Матрица):" + html
    
                }
            }
            document.getElementById('count').addEventListener('click', matrix);
            
        </script>
    
    </body>
    </html>
    JavaScript Keira Mata, Apr 3, 2020

  • 1 Answers
  • 0
    Nobody will look for the question in the text.



    Moreover, no one will do the task for you. This resource is perfect for a question like: "There is such a task, I think / did / understood this way, tried this and that. It did not work. Tell me where to go next."



    With your question, a freelance exchange is necessary.
    Anonymous

Your Answer
To place the code, please use CodePen or similar tool. Thanks you!