我正在尝试让代码为我的marzipano项目创建一个数据文件，它使用这个data.js而我不想为每个项目创建每个链接所以我试图循环它但它不打印它进入我的HTML页面。我想将其打印为文本，以便将结果复制并粘贴到我的js文件中，有没有办法修复我的代码或更好的方法呢？
P.S：我是javascript的总菜鸟
提前谢谢
function auto(number){
i = 0;
while (i < number) {
//Fist Scene
if(i === 0){
document.write('
<p>
{
"id": "0",
"name": "0",
"levels": [
{
"tileSize": 256,
"size": 256,
"fallbackOnly": true
},
{
"tileSize": 512,
"size": 512
},
{
"tileSize": 512,
"size": 1024
},
{
"tileSize": 512,
"size": 2048
}
],
"faceSize": 2000,
"initialViewParameters": {
"yaw": -3.0907815953112916,
"pitch": 0.06648956035942888,
"fov": 1.5707963267948966
},
"linkHotspots": [
{
"yaw": -3.128953846954726,
"pitch": 0.47317799909128944,
"rotation": 0,
"target": "1"
}
],
"infoHotspots": []
},</p>
')
}
//Last Scene
else if (i === number){
document.write('
<p>
{
"id": "'i'",
"name": "'i'",
"levels": [
{
"tileSize": 256,
"size": 256,
"fallbackOnly": true
},
{
"tileSize": 512,
"size": 512
},
{
"tileSize": 512,
"size": 1024
},
{
"tileSize": 512,
"size": 2048
}
],
"faceSize": 2000,
"initialViewParameters": {
"yaw": -3.1332154632455715,
"pitch": 0.062442602034723294,
"fov": 1.5707963267948966
},
"linkHotspots": [
{
"yaw": 0.008275683165861025,
"pitch": 0.3876084470351344,
"rotation": 0,
"target": "'i-1'"
}
],
"infoHotspots": []
}</p>'
)
}
//Actual loop
else if (i < number){
document.write('
{
"id": "i",
"name": "i",
"levels": [
{
"tileSize": 256,
"size": 256,
"fallbackOnly": true
},
{
"tileSize": 512,
"size": 512
},
{
"tileSize": 512,
"size": 1024
},
{
"tileSize": 512,
"size": 2048
}
],
"faceSize": 2000,
"initialViewParameters": {
"yaw": -3.0859786632885857,
"pitch": 0.058860826755053,
"fov": 1.5707963267948966
},
"linkHotspots": [
{
"yaw": 0.007751782217697567,
"pitch": 0.39202518148107757,
"rotation": 0,
"target": "'i-1'"
},
{
"yaw": -3.1285088198075375,
"pitch": 0.48530966110218543,
"rotation": 0,
"target": "'i+1'"
}
],
"infoHotspots": []
},<br>
')
}
}
}
}
auto(13);<html>
<head>
</head>
<body>
<script src="auto.js"></script>
</body>
</html>
答案 0 :(得分：0)
首先要说些什么：
document.write()。它会自己重写你的文档。pre代码来显示格式化数据，例如JSON或任何code代码段。while循环时，请在incrementer块中处理decrementer和while，以防止infinite循环。我认为以下解决方案适合您。
function auto(number){
var e = document.getElementById("data");
i = 0;
var html = "";
while (i <= number) {
//Fist Scene
if(i === 0){
html += `
<pre>
{
"id": "` + i + `",
"name": "0",
"levels": [
{
"tileSize": 256,
"size": 256,
"fallbackOnly": true
},
{
"tileSize": 512,
"size": 512
},
{
"tileSize": 512,
"size": 1024
},
{
"tileSize": 512,
"size": 2048
}
],
"faceSize": 2000,
"initialViewParameters": {
"yaw": -3.0907815953112916,
"pitch": 0.06648956035942888,
"fov": 1.5707963267948966
},
"linkHotspots": [
{
"yaw": -3.128953846954726,
"pitch": 0.47317799909128944,
"rotation": 0,
"target": "1"
}
],
"infoHotspots": []
},</pre>
`;
}
//Last Scene
else if (i === number){
html += `
<pre>
{
"id": "` + i + `",
"name": "` + i + `",
"levels": [
{
"tileSize": 256,
"size": 256,
"fallbackOnly": true
},
{
"tileSize": 512,
"size": 512
},
{
"tileSize": 512,
"size": 1024
},
{
"tileSize": 512,
"size": 2048
}
],
"faceSize": 2000,
"initialViewParameters": {
"yaw": -3.1332154632455715,
"pitch": 0.062442602034723294,
"fov": 1.5707963267948966
},
"linkHotspots": [
{
"yaw": 0.008275683165861025,
"pitch": 0.3876084470351344,
"rotation": 0,
"target": "` + (i-1) + `"
}
],
"infoHotspots": []
}</pre>
`;
}
//Actual loop
else if (i < number){
html += `
<pre>{
"id": "` + i + `",
"name": "` + i + `",
"levels": [
{
"tileSize": 256,
"size": 256,
"fallbackOnly": true
},
{
"tileSize": 512,
"size": 512
},
{
"tileSize": 512,
"size": 1024
},
{
"tileSize": 512,
"size": 2048
}
],
"faceSize": 2000,
"initialViewParameters": {
"yaw": -3.0859786632885857,
"pitch": 0.058860826755053,
"fov": 1.5707963267948966
},
"linkHotspots": [
{
"yaw": 0.007751782217697567,
"pitch": 0.39202518148107757,
"rotation": 0,
"target": "` + (i-1) + `"
},
{
"yaw": -3.1285088198075375,
"pitch": 0.48530966110218543,
"rotation":0,
"target": "` + (i+1) + `"
}
],
"infoHotspots": []
}</pre>
`;
}
i++;
}
e.innerHTML = html;
}
auto(13);<html>
<head>
</head>
<body>
<script src="auto.js"></script>
<div id="data"><div>
</body>
</html>