Можно ли автоматически сгенерировать некоторый код в HTML? - PullRequest
Новая
       4

Можно ли автоматически сгенерировать некоторый код в HTML?

0 голосов
/ 17 февраля 2020

Я новичок ie с HTML и, возможно, вопрос очень глупый, но возможно ли создать al oop в html?

То, что я сделал до сих пор, так это опрос, который запрашивает у пользователя номер. Теперь с этим числом идея состоит в том, чтобы создать определенную текстовую область с некоторыми входными данными.

Это то, что у меня есть: 

<p>-----DEFINITIONS----- 

    <h1 id="demo"></h1>
    <script>
        var cant_def=prompt("How many definitions do you have?")
        var cant_par= prompt("How many pairs do you have?")

    </script>
    <p><b>Definition 1:</b></p>
    <p>Introduce the word:</p>
    <input type="text" name="campo1" style="width: 300px;"/>
    <p>Introduce the meaning:</p>
    <input type="text" name="camp1_res" style="width: 500px;" />

   <!--<textarea id="def1" rows="1" cols="20" name="def1"></textarea></p>  --> 
</p>

Область с именем «Определение 1:» будет работать, только если заданное число, сохраненное в «cant_def», равно 1, а «cant_par» равно 2. Но если вы хотите иметь 3 определения и 4 пары, группа «Определение 1» появится 3 раза, а «campo1» и «camp1_res» будут повторяться 4 раза.

Позвольте мне показать вам, что я имею в виду на примере графика c.

На веб-странице вас попросят ввести цифры, а вы напишите «2», а затем «2». Таким образом, это будет сгенерированный код: 

<p><b>Definition 1:</b></p>
    <p>Introduce the word:</p>
    <input type="text" name="campo1" style="width: 300px;"/>
    <p>Introduce the meaning:</p>
    <input type="text" name="camp1_res" style="width: 500px;" />
    <p>Introduce the word:</p>
    <input type="text" name="campo1" style="width: 300px;"/>
    <p>Introduce the meaning:</p>
    <input type="text" name="camp1_res" style="width: 500px;" />



    <p><b>Definition 2:</b></p>
    <p>Introduce the word:</p>
    <input type="text" name="campo1" style="width: 300px;"/>
    <p>Introduce the meaning:</p>
    <input type="text" name="camp1_res" style="width: 500px;" />
    <p>Introduce the word:</p>
    <input type="text" name="campo1" style="width: 300px;"/>
    <p>Introduce the meaning:</p>
    <input type="text" name="camp1_res" style="width: 500px;" />

И это будет результат:

enter image description here

Еще одна важная вещь, переменная "cant_par" должна быть четным числом! Спасибо в советах ~

1 Ответ

0 голосов
/ 17 февраля 2020

HTML является только языком разметки и фактически не может выполнять код. Однако вы можете использовать JavaScript до l oop, используя настройки for и / или while. 

var number_of_definitions = 5;
for(i=0;i!=number_of_definitions;i++) {
    document.write("your html here");
}

Кроме того, ваши определения должны быть помещены в элементы <div> для упрощения обработки , Они очень помогают, когда вы попадаете на CSS или пытаетесь отформатировать что-либо.

...