如何使用变量的值更改文本及其颜色（i）

Question

嗨，我正在尝试根据变量“ i”的值更改文本及其颜色，而不使用任何事件监听器！我无法设置null错误的属性“ innerHTML”，对此是否有任何解决方法！谢谢！

var i = 0;      
var images= [];
var time = 3000;  
var eventaction=0;
var timeoutId;

var dynamictext=document.querySelector("dynamictext");



images[0] = "https://i.pinimg.com/236x/f4/92/39/f492399e154bd9f564d7fc5299c19911--purple-rain-deep-purple.jpg";
images[1] = "https://image.shutterstock.com/image-photo/purple-butterfly-isolated-on-white-260nw-44004850.jpg";
images[2] = "https://www.birdscanada.org/images/inbu_norm_q_townsend.jpg";


function changeImg()
{if(i<images.length-1)
{i++;
}else
{i=0;}
document.getElementById('sliders').src=images[i];eventaction=0;
dynamictextchanger();
} 
timeoutId=setTimeout("changeImg()", time);
}



function dynamictextchanger()
{
   if(i==1)
    {
      dynamictext.innerHTML="Starter";
      dynamicetxt.style.color="black";
    }
    else if(i==2)
    {
      dynamictext.innerHTML="veg";
      dynamicetxt.style.color="green";
    }
    else if(i==3)
    {
      dynamictext.innerHTML="nonveg";
      dynamicetxt.style.color="red";
    }
  }






window.onload=changeImg;

<p id="dynamictext"/>

<button class="button button3" id="leftbutton"> previous</button>
<img id="sliders" />

<button class="button button3" id="rightbutton">next</button>

Answer 1

此代码有太多错误。我什至不知道从哪里开始。但是其中一些修复程序应该可以使您启动并运行。

• 变量dynamicetxt不正确。
• 在querySelector方法中缺少井号＃符号
• 额外}

var i = 0;      
var images= [];
var time = 3000;  
var eventaction=0;
var timeoutId;

var dynamictext = document.querySelector("#dynamictext");

images[0] = "https://i.pinimg.com/236x/f4/92/39/f492399e154bd9f564d7fc5299c19911--purple-rain-deep-purple.jpg";
images[1] = "https://image.shutterstock.com/image-photo/purple-butterfly-isolated-on-white-260nw-44004850.jpg";
images[2] = "https://www.birdscanada.org/images/inbu_norm_q_townsend.jpg";

function changeImg()
{

if(i < images.length - 1) i++;
else i = 0;

document.getElementById('sliders').src=images[i];

eventaction=0;
dynamictextchanger(i);

timeoutId = setTimeout(changeImg, time);
}



function dynamictextchanger(i)
{
   if(i==0)
    {
      dynamictext.innerHTML="Starter";
      dynamictext.style.color="black";
    }
    else if(i==1)
    {
      dynamictext.innerHTML="veg";
      dynamictext.style.color="green";
    }
    else if(i==2)
    {
      dynamictext.innerHTML="nonveg";
      dynamictext.style.color="red";
    }
  }

window.onload = function(){ changeImg(); }

<p id="dynamictext"></p>

<button class="button button3" id="leftbutton"> previous</button>
<img id="sliders" />

<button class="button button3" id="rightbutton">next</button>

Answer 2

您已忘记此行上的#符号：

var dynamictext=document.querySelector("#dynamictext");