Как поместить данные JS в таблицу HTML

@Totto · Регистрация: 15.10.2019

Студворк — интернет-сервис помощи студентам

Подскажите пожалуйста, облазила уже все. Вот допустим у меня есть файл имя.html и в нем есть пустая таблица ячеек по типу:

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
  <table>
            <tr>
                <td></td>
                <td></td>
                <td></td>
            </tr>
 
            <tr>
                <td></td>
                <td></td>
                <td></td>        
            </tr>
  </table>

И у меня есть файл имя.js и в нем какой то массив

JavaScript
1
x=[1,2,3,4,5,6]

Я хочу чтоб при нажатии на кнопку моя таблица в html заполнилась этим массивом, то есть получилось что то типо:

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
  <table>
            <tr>
                <td>1</td>
                <td>2</td>
                <td>3</td>
            </tr>
 
            <tr>
                <td>4</td>
                <td>5</td>
                <td>6</td>        
            </tr>
  </table>

Все что я нашла это как сделать наоборот, то есть вот написали нам какой то инпут в ячейку, и потом я его в джаве могу взять и что то с ним сделать, но как сделать наоборот? Чтоб взять что то из джавы и положить в таблицу html.

P.S. Дело в том что мне надо сделать Судоку, используя html,css для дизайна и JS.

У меня есть код генерирующий таблицу в JS по всем правилам судоку, но я не знаю как его перетащить в таблицы в html чтоб иметь возможность отредактировать их в css.

@Mr_Sergo · 15.10.2019, 01:55

Totto,

https://codepen.io/Mr_Sergo/pe... itors=1010

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
<table>
    <tr>
        <td class="my-td"></td>
        <td class="my-td"></td>
        <td class="my-td"></td>
    </tr>
    <tr>
        <td class="my-td"></td>
        <td class="my-td"></td>
        <td class="my-td"></td>
    </tr>
</table>

JavaScript
1
2
3
4
let x = [1, 2, 3, 4, 5, 6];
let my_td = document.querySelectorAll('.my-td');
 
my_td.forEach((el, i) => el.textContent = x[i]);

Новые блоги и статьи Все статьи Все блоги /
Functional First Web Framework Suave DevAlt 30.03.2026 Sauve. IO Апнулись до NET10. Из зависимостей один пакет, работает одинаково хорошо как в режиме проекта так и в интерактивном режиме. из сложностей - чисто функциональный подход. Решил. . .	Автоматическое создание документа при проведении другого документа Maks 29.03.2026 Реализация из решения ниже выполнена на нетиповых документах, разработанных в конфигурации КА2. Есть нетиповой документ "ЗаявкаНаРемонтСпецтехники" и нетиповой документ "ПланированиеСпецтехники". В. . .	Настройка движения справочника по регистру сведений Maks 29.03.2026 Решение ниже реализовано на примере нетипового справочника "ТарифыМобильнойСвязи" разработанного в конфигурации КА2, с целью учета корпоративной мобильной связи в коммерческом предприятии. . . .	Автозаполнение реквизита при выборе элемента справочника Maks 27.03.2026 Программный код из решения ниже на примере нетипового документа "ЗаявкаНаРемонтСпецтехники" разработанного в конфигурации КА2. При выборе "Спецтехники" (Тип Справочник. Спецтехника), заполняется. . .
Сумматор с применением элементов трёх состояний. Hrethgir 26.03.2026 Тут. https:/ / fips. ru/ EGD/ ab3c85c8-836d-4866-871b-c2f0c5d77fbc Первый документ красиво выглядит, но без схемы. Это конечно не даёт никаких плюсов автору, но тем не менее. . . всё может быть. . .	Автозаполнение реквизитов при создании документа Maks 26.03.2026 Программный код из решения ниже размещается в модуле объекта документа, в процедуре "ПриСозданииНаСервере". Алгоритм проверки заполнения реализован для исключения перезаписи значения реквизита,. . .	Команды формы и диалоговое окно Maks 26.03.2026 1. Команда формы "ЗаполнитьЗапчасти". Программный код из решения ниже на примере нетипового документа "ЗаявкаНаРемонтСпецтехники" разработанного в конфигурации КА2. В качестве источника данных. . .	Кому нужен AOT? DevAlt 26.03.2026 Решил сделать простой ланчер Написал заготовку: dotnet new console --aot -o UrlHandler var items = args. Split(":"); var tag = items; var id = items; var executable = args;. . .

Как поместить данные JS в таблицу HTML

Решение