Я не знаю, как разбить вход в html5, возможно, в css вы можете использовать тот же класс для управления своим вводом, и вы можете вводить стиль, например:
div{
text-align:center;
background:#eee;
}
input{
border: 0;
outline: 0;
background: transparent;
border-bottom: 2px solid black;
width: 100px;
text-align:center;
padding : 5px;
margin-left:10px;
}
button{
margin-top:20px !important;
margin: 0 auto;
color: white;
border-radius: 4px;
text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
}
<div>
<input class="form-control" placeholder="0" maxlength="1" />
<input class="form-control" placeholder="0" maxlength="1" />
<input class="form-control" placeholder="0" maxlength="1" />
<input class="form-control" placeholder="0" maxlength="1" />
<br><button type="button" onclick="myFunction()">Submit</button>
<p id="optRes"></p>
</div>
Определить myFunction () и вы можете получить свой массив по вашему классу: form-control, конвертировать в строку, затем в int, если вам нужно его проверить. Помогает?
Он остается внутри текущей области видимости, самой внешней области блока (или глобальной области видимости, которую так хорошо упоминает Берги), так что это будет работать
<script>
let world = 'world';
</script>
<script>
console.log( `hello ${world}` );
</script>
Где бы это не было
<script>
{
let world = 'world';
}
</script>
<script>
console.log( `hello ${world}` );
</script>
действительно не имеет значения, что вы используете 2 разные файлы. В итоге все загружаемые скрипты помещаются друг за другом, оптимизируются и выполняются