使用 JS 和 JS 范围在 HTML 页面内“写入”

Question

I'm developing a program which basically just receives input from the user twice (risk carrier and sum, but that's just a placeholder to make my program less abstract), groups those two values together and then repeats the contents in a loop.我正在开发一个程序，它基本上只接收用户的输入两次（风险载体和求和，但这只是一个占位符，使我的程序不那么抽象），将这两个值组合在一起，然后在循环中重复内容。 See the code below.请参阅下面的代码。

<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>

My issues are:我的问题是：

1.) I want to display the array by writing into an HTML element, which I attempted in the for-loop. 1.) 我想通过写入我在 for 循环中尝试的 HTML 元素来显示数组。 Pop-ups are to be avoided.应避免弹出窗口。 How can I loop through HTML elements, such as demo1, demo2, demo3 etc.?如何遍历 HTML 元素，例如 demo1、demo2、demo3 等？ I can't just write <p id="demo" + i></p> .我不能只写<p id="demo" + i></p> 。 What other options are there?还有哪些其他选择？

2.) Say I want to make use of the untilNow() function. 2.) 假设我想使用 untilNow() 函数。 The scope of my arrays is limited to fillArray().我的数组的范围仅限于 fillArray()。 Do I need to "return" the arrays to the untilNow() function as parameters?我是否需要将数组作为参数“返回”给 untilNow() 函数？

Thanks everyone!!!谢谢大家！！！

Answer 1

The problem with your current code is that you're replacing the html by the last value in every loop.您当前代码的问题在于您在每个循环中都用最后一个值替换了 html。 You're using = rather than += .您正在使用=而不是+= 。 So, a quick fix would be to replace:因此，快速解决方法是替换：

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

by:经过：

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

An example of how you could wrap an array of strings in HTMLElements and add them to your document (note that there are many other ways/libraries to achieve the same result):如何在 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 result; }, document.createDocumentFragment()); // Actually add the new content document.querySelector("ul").appendChild(newContent);

 <ul class="js-list"></ul>

使用 JS 和 JS 范围在 HTML 页面内“写入”

问题描述

1 个解决方案

解决方案1
1 2016-10-07 12:03:54

使用 JS 和 JS 范围在 HTML 页面内“写入”

问题描述

1 个解决方案

解决方案1 1 2016-10-07 12:03:54

解决方案1
1 2016-10-07 12:03:54