Блог

Главная - Вопросы по программированию - «Запись» внутри HTML-страницы с использованием JS и JS scope

«Запись» внутри HTML-страницы с использованием JS и JS scope

#javascript #html #arrays

#javascript #HTML #массивы

Вопрос:

Я разрабатываю программу, которая в основном просто получает входные данные от пользователя дважды (носитель риска и сумма, но это просто заполнитель, чтобы сделать мою программу менее абстрактной), группирует эти два значения вместе, а затем повторяет содержимое в цикле. Смотрите код ниже.

 <head>

<script type="text/javascript">
function fillArray(){
    document.getElementById("danke").innerHTML = "Thanks for specifying the amount of entries.";
    var numberOfEntries = parseInt(document.getElementById('input0').value);
    var i = 0;
    var myArrA = [];
    var myArrB = [];
    var x = " ";
    while(i<numberOfEntries){
       var neuRT = prompt("Enter a risk carrier");
       myArrA.push(neuRT);
       var neuRH = prompt("Enter a risk sum");
       myArrB.push(neuRH);
       i  ;
    }
    for(i = 0; i<anzahlEintraege; i  ){
        x = myArrA[i]   " carries a risk of "   myArrB[i];
    document.getElementById("test").innerHTML = x;
    }

}


</script>
</head>

<body>

<h1>risk assessment</h1>

<input type="text" id="input0" />
<button type="button" onclick="fillArray()">Number of entries</button> <p id="danke"></p>

<button type="button" onclick="untilNow()">Show all entries so far</button>
<br />
<br />
<div id="test"></div>

</body>
</html>

Мои проблемы:

1.) Я хочу отобразить массив путем записи в HTML-элемент, который я попытался выполнить в цикле for. Следует избегать всплывающих окон. Как я могу перебирать HTML-элементы, такие как demo1, demo2, demo3 и т.д.? Я не могу просто писать <p id="demo" i></p> . Какие еще есть варианты?

2.) Скажем, я хочу использовать функцию untilNow() . Область действия моих массивов ограничена fillArray() . Нужно ли мне «возвращать» массивы в функцию untilNow() в качестве параметров?

Спасибо всем!!!

Ответ №1:

Проблема с вашим текущим кодом заключается в том, что вы заменяете html на последнее значение в каждом цикле. Вы используете = , а не = . Итак, быстрым решением было бы заменить:

 document.getElementById("test").innerHTML = x;

Автор::

 document.getElementById("test").innerHTML  = x;

Пример того, как вы могли бы обернуть массив строк в HtmlElements и добавить их в свой документ (обратите внимание, что есть много других способов / библиотек для достижения того же результата):

 var myStrings = ["Hello", "stack", "overflow"];

// Two performance rules:
// 1. Use a fragment to prevent multiple updates to the DOM
// 2. No DOM queries in the loop
var newContent = myStrings.reduce(function(result, str) {
  var li = document.createElement("li");
  var txt = document.createTextNode(str);
  li.appendChild(txt);
  result.appendChild(li);
  
  return resu<
}, document.createDocumentFragment()); 


// Actually add the new content
document.querySelector("ul").appendChild(newContent);  
 <ul class="js-list"></ul>