Задать вопрос
@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>
  • Вопрос задан
  • 112 просмотров
Комментировать
Подписаться 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 ₽
JavaScript Fullstack
OnClass
от 2 000 до 7 000 $
JavaScript FullStack developer
Wanted. • Санкт-Петербург
До 220 000 ₽
Ещё вакансии
Заказы с Хабр Фриланса
IOS, переделать твик с rootfull под rootless jailbreak, есть исходник
22 дек. 2024, в 01:54
50000 руб./за проект
AppMetrica для Godot ( Можете предлагать свою цену )
21 дек. 2024, в 23:34
3000 руб./за проект
Разработка интеграции в make.com
21 дек. 2024, в 22:05
2000 руб./в час
Ещё заказы