@Fade_X

Как сделать отступ от текста 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>
  • Вопрос задан
  • 90 просмотров
Пригласить эксперта
Ответы на вопрос 3
sergski
@sergski
web-developer
С помощью offsetWidth или getBoundingClientRect получить элемент с максимальной шириной и применить для всех
Ответ написан
Комментировать
VoidVolker
@VoidVolker Куратор тега JavaScript
Dark side eye. А у нас печеньки! А у вас?
Просто сразу все в таблицу положить - она специально для этого и создана.
Ответ написан
Комментировать
@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>";
        }
    }

Ответ написан
Ваш ответ на вопрос

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

Войти через центр авторизации
Похожие вопросы