Написание текста и DarkMode несовместимы

Мне нужна твоя помощь! Я хочу автоматический ввод текста и включение / выключение DarkMode. Я скопировал написание текста у другого разработчика. Но я создаю DarkMode в одиночку. Написание текста работало. DarkMode тоже. Но когда я использую оба на одной странице, один из них не работает. Я проверил все те же переменные, я даже добавил к переменным несколько нулевых значений, чтобы сбросить их. Или я пытаюсь использовать разные значения. Но ничего. Что с этим, пожалуйста?

Это JS:

//Check, if DarkMode is ON, or not
function getCookie(cname) {
 var name = cname + " = ";
 var decodedCookie = decodeURIComponent(document.cookie);
 var ca = decodedCookie.split(';');
 for(var i = 0; i <ca.length; i++) {
   var c = ca[i];
   while (c.charAt(0) == ' ') {
     c = c.substring(1);
   }
   if (c.indexOf(name) == 0) {
     return c.substring(name.length, c.length);
   }
 }
 return "";
}

function checkCookie() {
 var dmTheme = getCookie("darkmode");
 if (dmTheme === "active") {
  console.info("Darkmode is " + dmTheme);
  $("#switching").prop("checked", true);
  darkMode();
  $("#switching").prop("checked", true);
 } else {
   console.info("Darkmode is " + dmTheme);
   $("#switching").prop("checked", false);
 }
}

//Reset variables
var i = null;
var c = null;
var name = null;
var ca = null;

//Writting text
var TxtType = function(el, toRotate, period) {
   this.toRotate = toRotate;
   this.el = el;
   this.loopNum = 0;
   this.period = parseInt(period, 10) || 2000;
   this.txt = '';
   this.tick();
   this.isDeleting = false;
};

TxtType.prototype.tick = function() {
   var i = this.loopNum % this.toRotate.length;
   var fullTxt = this.toRotate[i];

   if (this.isDeleting) {
   this.txt = fullTxt.substring(0, this.txt.length - 1);
   } else {
   this.txt = fullTxt.substring(0, this.txt.length + 1);
   }

   this.el.innerHTML = '<span class = "wrap">'+this.txt+'</span>';

   var that = this;
   var delta = 200 - Math.random() * 100;

   if (this.isDeleting) { delta /= 2; }

   if (!this.isDeleting && this.txt === fullTxt) {
   delta = this.period;
   this.isDeleting = true;
   } else if (this.isDeleting && this.txt === '') {
   this.isDeleting = false;
   this.loopNum++;
   delta = 500;
   }

   setTimeout(function() {
   that.tick();
   }, delta);
};

window.onload = function() {
   var elements = document.getElementsByClassName('typewrite');
   for (var i=0; i<elements.length; i++) {
       var toRotate = elements[i].getAttribute('data-type');
       var period = elements[i].getAttribute('data-period');
       if (toRotate) {
         new TxtType(elements[i], JSON.parse(toRotate), period);
       }
   }
   var css = document.createElement("style");
   css.type = "text/css";
   css.innerHTML = ".typewrite > .wrap { border-right: 0.08em solid #fff}";
   document.body.appendChild(css);
};

Есть HTML-код для написания текста:

<div class = "heading">
   <p class = "headP">Welcome, I am</p>
<h1>
   <a href = "" class = "typewrite h11" data-period = "2000" data-type='[ "MartanKing.", "Fullstack Developer.", "Junior WebMaster.", "WebDesigner." ]'>
     <span class = "wrap"></span>
   </a>
 </h1>
</div>

А для DarkMode:

   <div class = "fdiv2">
       <div class = "dark">
       <p class = "fotxt2"><i class = "fas fa-adjust"></i> DarkMode</p>
       <label class = "switch">
       <input type = "checkbox" onclick = "darkMode()" class = "darktogg" id = "switching">
       <span class = "slider round"></span>
       </label>
       </div>

Пожалуйста, мне очень нужна твоя помощь. Спасибо

Похоже, вы забыли определить функцию darkMode в этом коде. Таким образом, darkMode(); выдаст ошибку, как и событие щелчка. Вы действительно хотели onclick = "checkCookie()"?

Drkawashima 07.04.2021 02:40
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
0
1
30
0

Другие вопросы по теме