无法通过Id

时间:2017-12-02 15:57:06

标签: javascript html css

我试图更改多个div元素的innerHTML。但我尝试的一切都没有用。



var divIds = ["kartinka0", "kartinka1", "kartinka2", "kartinka3", "kartinka4", "kartinka5", "kartinka6", "kartinka7", "kartinka8", "kartinka9", "kartinka10", "kartinka11"];
var Inners = [
  "<img src='0.png' style='transform: translate(0px, -184px);'></img>",
  "<img src='1.png' style='transform: translate(90px, -160px);'></img>",
  "<img src='2.png' style='transform: translate(170px, -90px);'></img>",
  "<img src='3.png' style='transform: translate(195px, 0px);'></img>",
  "<img src='4.png' style='transform: translate(180px, 100px);'></img>",
  "<img src='5.png' style='transform: translate(100px, 170px);'></img>",
  "<img src='6.png' style='transform: translate(0px, 200px);'></img>",
  "<img src='7.png' style='transform: translate(-95px, 175px);'></img>",
  "<img src='8.png' style='transform: translate(-170px, 100px);'></img>",
  "<img src='9.png' style='transform: translate(-200px, 5px);'></img>",
  "<img src='10.png' style='transform: translate(-170px, -95px);'></img>",
  "<img src='11.png' style='transform: translate(-90px, -160px);'></img>"
];

document.getElementById(divIds[0]).innerHTML = Inners[0];

var counter = 0;
var previousDiv = "nothing",
  currentDiv = "nothing";

setInterval(function() {
  if (counter == 12) counter = 0;

  if (counter == 0) previousDiv = "kartinka11";
  else previousDiv = divIds[counter - 1];

  currentDiv = divIds[counter];

  document.getElementById(previousDiv).innerHTML = " ";
  document.getElementById(currentDiv).innerHTML = Inners[counter];

  counter++;
}, 5000);
&#13;
<div id="kartinka0" class="centrirane"></div>
<div id="kartinka1" class="centrirane"></div>
<div id="kartinka2" class="centrirane"></div>
<div id="kartinka3" class="centrirane"></div>
<div id="kartinka4" class="centrirane"></div>
<div id="kartinka5" class="centrirane"></div>
<div id="kartinka6" class="centrirane"></div>
<div id="kartinka7" class="centrirane"></div>
<div id="kartinka8" class="centrirane"></div>
<div id="kartinka9" class="centrirane"></div>
<div id="kartinka10" class="centrirane"></div>
<div id="kartinka11" class="centrirane"></div>
<div id="nothing" class="centrirane"></div>
&#13;
&#13;
&#13;

它根本不起作用,但它应该......如果我通过名字或数组调用Ids并不重要,它不会改变任何东西。不是style.display或任何属性。在这些Ids上没有任何作用,我已经绝望了。
任何帮助都非常感谢!

编辑:
document.getElementById(divIds [0])。innerHTML = Inners [0];
TypeError:无法设置属性&#39; innerHTML&#39;是的
当我使用alert并给它divIds [0]或Inners [0]时,它会从这些数组中弹出字符串。就像html部分中的这些ID不存在一样。

2 个答案:

答案 0 :(得分:1)

有一个循环&#34;我&#34;那是没有定义的。你应该替换

currentDiv = divIds[i];

currentDiv = divIds[counter];

答案 1 :(得分:0)

function start()
{
    startDiv = divIds[0];
    document.getElementById(startDiv).innerHTML = Inners[0];
    setTimeout(function(){
        document.getElementById(startDiv).innerHTML = " ";
    }, 5000);
}
<body onload="start()"

诀窍。谢谢Heiko Jakubzik和Daniel Beck的合作。