0

I have recently started coding.

I wanted to make a site where typing effect is reproduced.

I followed a tutorial, but opening the Chrome console I find this error: "Cannot set properties of null (setting 'textContent')"

If I try to run it on codepen it works, but if I use my text editor and run the code on Chrome it doesn't.

I also leave you the link for the code: https://codepen.io/andreab16/pen/KKQegQN

var texts = ["designer", "F1 enthusiast", "guy", "human"];

let count = 0;
let index = 0;
let currentText = "";
let letter = "";

(function type() {
  if (count === texts.length) {
    count = 0;
  }

  currentText = texts[count];

  letter = currentText.slice(0, ++index);

  document.querySelector(".typing").textContent = letter;
  console.log("ok");

  if (letter.length === currentText.length) {
    count++;
    index = 0;
  }

  setTimeout(type, 250);
})();

Thank you very much everyone

andreab16
  • 11
  • HI Andrea. This is a difficult question to address without additional information. You've provided a functioning codepen, which is great, normally, except that since it's working as expected, there's no way for anyone to tell what might be different about your local environment. The error is telling you that your javascript code is unable to find an element of [class](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/class) `typing` (this part: `document.querySelector(".typing")`), so it can't do anything with it. Probably your local html is different from the codepen. – thisisrandy Jun 02 '22 at 21:53

0 Answers0