在javascript中使用document.write循环输出

Question

问题：如何在javascript中使用循环构建变量的字符串内容？

我需要在以下脚本（php）中完成我所做的事情，但不是将其输出到页面，而是需要将其作为字符串插入到javascript变量中。

$titles[1]='fire';
$titles[2]='auto';
$titles[3]='health';
$titles[4]='loan';
$titles[5]='life';

for ($x=1; $x<=5; $x++)
    {
    echo
    '
    <div class="ball">

        <p class="ball-fraction">
            <span id="attained-' . $titles[ $x ] . '-score">0</span>/<span id="required-' . $titles[ $x ] . '-score">0</span>
        </p>
        <p class="ball-title">
            ' . $titles[ $x ] . '
        </p>
    </div>
    '
    }

目的：完成后，我可以将变量用作循环父元素集中的模块。列表中的列表输出，简单地说。假设由于页面内容的动态特性以及为了缩短代码而这是必要的。

示例1：

在这个例子中，用户的5个统计模块可以在页面加载时用php生成，并且随着时间的推移，javascript（基于节点）动态控制信息。

示例2：

在这个例子中，另一方面，循环的stat模块需要在另一个循环输出中使用（列表中的每个条目）。

Answer 1

使用+进行字符串连接。

var titles = [ "fire", "auto", "home", "health", "life" ];
var result = '';
for (var x = 0; x < titles.length; x++) {
    result += '<div class="ball"> \
                <p class="ball-fraction"> \
                    <span id="attained-' . titles[x] + '-score">0</span>/<span id="required-' + titles[x] + '-score">0</span> \
                </p> \
                <p class="ball-title">'+ titles[x] + '</p> \
            </div>';
}
document.getElementById('someDiv').innerHTML = result;

Answer 2

我的建议是你仍然可以输出所有内容。但您可以使用css设置display:none;。然后，当您需要显示它时，您可以在任何您想要的地方使用javascript。