主页 / 问题 / 929692
Accepted
Anton Brock
Asked:2020-01-08 21:31:38 +0000 UTC2020-01-08 21:31:38 +0000 UTC

为什么背景没有变化？

  • 772

大家好！起初背景有问题，但经过多次尝试，我能够修复背景，使其在使用 localStorage 更新或转换后不会改变，现在我不明白为什么在一段时间后（例如 3 秒）它确实没变。

请告知如何解决这个问题？我认为它在 localStorage 中未完成，但我不知道如何修复它。感谢大家！

 window.onload = function() {
            const date = new Date();
            const time = date.getHours() + ':' +addZero(date.getMinutes());
            document.getElementsByTagName('div') [1].innerHTML = time;
            window.setTimeout(arguments.callee, 1000);
            function addZero(num) {
                var str = num.toString();
                return str.length == 1? "0" + str : str;
            };
        } ();
        
        
 function getRandomArbitrary(min, max) {
            return  Math.floor(min + Math.random() * (max + 1 - min))
        }
            let randomItem = getRandomArbitrary(0,36)
                if(window.innerWidth = 1600) {
            document.getElementsByClassName('p1')[randomItem].style.display="block";
}


localStorage.setItem('name', 'conteiner');
document.getElementById('conteiner').innerHTML = localStorage.getItem('name');
localStorage.removeItem('name');

const phr = new Array();
phr.push("https://images.wallpaperscraft.ru/image/les_tuman_derevia_126479_1920x1080.jpg");
phr.push("https://images.wallpaperscraft.ru/image/gory_ozero_vershiny_vid_sverkhu_119133_1920x1080.jpg");

function Rotator_cont() {
  const s = 3000;
  const N = phr.length;
  const i = Math.round(Math.random() * (N));
  Rotator(i);

  function Rotator(i) {
    i++;
    if (i > N - 1) {
      i = 0
    }; //alert(i);
    document.getElementById('conteiner').style.backgroundImage = 'url(' + phr[i] + ')';
    timerId01 = setTimeout(function() {
      Rotator(i)
    }, s);
    return;
  }
}
Rotator_cont()
#conteiner {
   width: 100%;
   height: 100%;
   display: flex;
   justify-content: center;
   flex-direction: column;
   align-items: center;
 }
 
 .mainTime {
    display: flex;
    margin-top: 110px;
    font-size: 200px;
    color:white;
    
}
.mainWord {
    display: flex;
    font-size: 50px;
    position: absolute;
    margin-top: 190px;
    color:white;
}

.p1 {
    display: none;
}
<div id="conteiner">
  <div class="mainTime"></div>
  <div class="mainWord">
    <div class="p1">Fortune favors the brave</div>
  </div>
</div>

好的，人们用#指出了错误。但是现在，在“容器”窗口中，语言环境不起作用，控制台中的错误是相同的（Uncaught TypeError: Cannot set property 'innerHTML' of undefined），并且背景在计时器上发生变化。

让我解释一下我要做什么：这是我（用户）我在页面上，我看到了背景（它有一个 5 分钟的计时器）。关闭了页面。3分钟后。我再次登录并看到相同的背景。又关门了。但是10分钟后我会进来，背景已经改变了。那些。将计时器本身+用户拥有的背景保存在本地。

背景本身附加到一个空的div，我认为这是错误的问题。

javascript

1 个回答

  1. Best Answer

    问题在于：

    document.getElementById('#conteiner').innerHTML = localStorage.getItem('name');

    没有带有 id 的元素#conteiner，所以当执行这一行时，出现了一个错误，并且进一步的代码执行根本没有进行。

    要修复它，您可以简单地删除此行，或将其从选择器中删除#，使其保持 simple .getElementById('conteiner')，因为它已经在下面的代码中：

    document.getElementById('conteiner').style.backgroundImage
    • 1

相关问题