admin管理员组

文章数量:1026989

I am coding in WordPress to make a button to toggle body class from light-mode to dark-mode. i was experimenting with trying to add a cookie so that the preference is remembered for the browser. But i receive a error Cannot set property className of null at setThemeFromCookie.

moreover clicking the button gives another error (index):486 Uncaught TypeError: Cannot read property 'className' of null at togglePageContentLightDark

My url is you can see the button in blue color located in footer

JS follows

 function togglePageContentLightDark() {
      var body = document.getElementById('body')
      var currentClass = body.className
      var newClass = body.className == 'dark-mode' ? 'light-mode' : 'dark-mode'
      body.className = newClass

  document.cookie = 'theme=' + (newClass == 'light-mode' ? 'light' : 'dark')
  console.log('Cookies are now: ' + document.cookie)
}

function isDarkThemeSelected() {
  return document.cookie.match(/theme=dark/i) != null
}

function setThemeFromCookie() {
  var body = document.getElementById('body')
  body.className = isDarkThemeSelected() ? 'dark-mode' : 'light-mode'
}

(function() {
  setThemeFromCookie()
})();

HTML for button

<button type="button" name="dark_light" onclick="togglePageContentLightDark()" title="Toggle dark/light mode">
I am coding in WordPress to make a button to toggle body class from light-mode to dark-mode. i was experimenting with trying to add a cookie so that the preference is remembered for the browser. But i receive a error Cannot set property className of null at setThemeFromCookie.



moreover clicking the button gives another error (index):486 Uncaught TypeError: Cannot read property 'className' of null at togglePageContentLightDark



My url is 
you can see the button in blue color located in footer



JS follows



 function togglePageContentLightDark() {
      var body = document.getElementById('body')
      var currentClass = body.className
      var newClass = body.className == 'dark-mode' ? 'light-mode' : 'dark-mode'
      body.className = newClass

  document.cookie = 'theme=' + (newClass == 'light-mode' ? 'light' : 'dark')
  console.log('Cookies are now: ' + document.cookie)
}

function isDarkThemeSelected() {
  return document.cookie.match(/theme=dark/i) != null
}

function setThemeFromCookie() {
  var body = document.getElementById('body')
  body.className = isDarkThemeSelected() ? 'dark-mode' : 'light-mode'
}

(function() {
  setThemeFromCookie()
})();




HTML for button



<button type="button" name="dark_light" onclick="togglePageContentLightDark()" title="Toggle dark/light mode">

                本文标签：
                cssCannot set property 39className39 of null at setThemeFromCookie

                        版权声明：本文标题：css - Cannot set property &#39;className&#39; of null at setThemeFromCookie 内容由热心网友自发贡献，该文观点仅代表作者本人，
                        转载请联系作者并注明出处：http://it.en369.cn/questions/1745661112a2161896.html，
                        本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。