Задать вопрос
@Fade_X
javascript

Как сделать отступ от текста JS+HTML?

Помогите пожалуйста!
Пользователь вводит число на странице, код выдаёт строки с новыми полями для ввода, количество строк на выводе равно числу, которое вводит пользователь.
Нужно сдвинуть первые 9 строк, чтобы они были в один уровень с 10-й и последующими строками без использования CSS.
Исходный код и результат работы программы прилагаю ниже:
Результат работы программы:6705026f2f91c009790724.png
Как по итогу должно выглядеть:670502c7685f4187671378.png

<!DOCTYPE html>
<html>
<head>
<script language=Javascript>
    function TableYchastki() {
        let n = ChisloYchastkov.value;
        div1.style.display = "block";
        for (let i = 1; i <= n; i++) {
            if (i <= n) {
                div1.innerHTML = div1.innerHTML + "Площадь повреждённой территории на " + i + " участке: <input type=text id='ploshad" + i + "'><br>";
            }
        }
    }
</script>
</head>
<body>
    <b>Количество лесных участков, подверженных болезни</b><br><br>
    <input type=text value="10" id="ChisloYchastkov"><br><br>
    <input type=button value="Далее" onClick="TableYchastki(); this.disabled=true;" id="Button1"><br><hr>
    <div id="div1" style="display:none"></div>
</body>
</html>
  • Вопрос задан
  • 110 просмотров
Комментировать
Подписаться 1 Простой Комментировать
Пригласить эксперта
Ответы на вопрос 3
VoidVolker
@VoidVolker Куратор тега JavaScript
Dark side eye. А у нас печеньки! А у вас?
Просто сразу все в таблицу положить - она специально для этого и создана.
Ответ написан
Комментировать
Комментировать
sergski
@sergski
web-developer
С помощью offsetWidth или getBoundingClientRect получить элемент с максимальной шириной и применить для всех
Ответ написан
Комментировать
Комментировать
@ksnk
Тег < tt> -отображение текста моноширинным шрифтом, обрамить им нужный div, или вообще подменить его на тот тег
Ну и выводить числа с ведущими пробелами:
function TableYchastki() {
        let n = ChisloYchastkov.value, h=1+Math.floor(Math.log10(n));
        div1.style.display = "block";
        for (let i = 1; i <= n; i++) {
          div1.innerHTML = div1.innerHTML + "Площадь повреждённой территории на " +
             (" ".repeat(h) + i).slice (-h).replace(/\s/g,"&nbsp;") + 
             " участке: <input type=text id='ploshad" + i + "'><br>";
        }
    }

Ответ написан
2 комментария
2 комментария
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы
Вакансии с Хабр Карьеры
JavaScript FullStack разработчик
Rocket • Смоленск
от 80 000 до 130 000 ₽
Fullstack разработчик JavaScript, php
Дорстрой-36 • Воронеж
от 100 000 до 200 000 ₽
JavaScript FullStack developer
Wanted. • Санкт-Петербург
До 220 000 ₽
Ещё вакансии
Заказы с Хабр Фриланса
Разработка мобильного приложения с дополненной реальностью (AR)
21 нояб. 2024, в 20:14
200000 руб./за проект
Внедрить код Roistat
21 нояб. 2024, в 19:31
500 руб./за проект
VPN приложение на IOS
21 нояб. 2024, в 19:28
200000 руб./за проект
Ещё заказы