猿问

如何使用 javascript 在 3 秒的时间间隔后更改 css 属性?

这是我一直在使用的 javascript 代码。我不断收到错误


    '''

    cannot set property 'animationplaystate' of undefined.

    '''


    '''

    window.setTimeout(function time(){

      var run=document.getElementsByClassName('logo');

      run.style.animationplaystate='paused';

     }, 3000);

    '''

下面是元素的样式


'''

.logo{

color: rgb(0, 158, 150);

float:right;

padding-right:0px;

font-weight: 600;

padding-top:5px;

margin-right: 20px;

font-size: 2em;

padding-left: 30px;

animation-name:logo;

animation-duration: 1.5s;

animation-play-state: running; 

}


'''


慕娘9325324
浏览 160回答 3
3回答

繁花不似锦

根据文档Mozilla Developer NetworkgetElementsByClassNameDocument 接口的方法返回array-like object具有所有给定类名的所有子元素中的一个所以技术上getElementsByClassName总是返回一个数组您需要使用数组索引来访问元素另外样式属性animationPlayState在您的代码中是驼峰式大小写都是小写字母试试这个代码run[0].style.animationPlayState = 'paused'要完全使用 CSS 启动动画和停止动画,您可以尝试.logo {  animation-play-state: paused; }.logo:hover {  animation-play-state: running;}所以,对于你的情况,你甚至不需要 javascript

慕妹3146593

run.style['animation-play-state'] = 'paused';

扬帆大鱼

据我所知:DOM 还没有准备好让浏览器 API 告诉 JavaScript 更多信息。窗口 setTimeout 在 DOM 准备好之前执行(在 window.onload 之前)。你正面临这个 pb: Javascript document.getElementsByClassName 返回 undefined我的答案是包裹在 window.load (或 document.ready)中:window.addEventListener("load", function() {    // code here});考虑准备好文件。 window.onload 与 $(document).ready)
随时随地看视频慕课网APP

相关分类

JavaScript
我要回答