for循环给class添加内容

Tong0068 2018-09-16 10:30:26
主要代码如下,获取视频的时长,但在每个class上都会全部遍历出来,怎么让它只在对应的div里遍历呢,本人是初学者,小白一个,还希望能有大神来指点一二,感激不尽。
html:
<div class="video-content">
<div class="video-list">

<div class="video-top">
<video style="width: 100%; height:100%; object-fit: fill" oncanplaythrough="myFunction(this)">
<source src="http://www.runoob.com/try/demo_source/movie.ogg" type="video/mp4">
</video>
<div>
<img src="images/bofang2.png">
<p class="video-time getDuration"></p>
</div>
</div>

<div class="video-top">
<video style="width: 100%; height:100%; object-fit: fill" oncanplaythrough="myFunction(this)">
<source src="http://www.w3school.com.cn/i/movie.ogg" type="video/mp4">
</video>
<div>
<img src="images/bofang2.png">
<p class="video-time getDuration"></p>
</div>
</div>

</div>
<div>

js:
function myFunction(ele) {
var videolist = document.getElementsByClassName("video-list");
var getId = document.getElementsByClassName("getDuration");
var hour = parseInt((ele.duration) / 3600);
var minute = parseInt((ele.duration % 3600) / 60);
var second = Math.ceil(ele.duration % 60);
for (var i = 0; i < videolist.length; i++) {
if (hour == 0) {
getId[i].innerHTML += minute + ":" + second;
} else {
getId[i].innerHTML += hour + " : " + minute + ":" + second;
}
}

}
}

...全文
920 2 打赏 收藏 转发到动态 举报
写回复
用AI写文章
2 条回复
切换为时间正序
请发表友善的回复…
发表回复
天际的海浪 2018-09-17
  • 打赏
  • 举报
回复
    function myFunction(ele) {
        var getId = ele.parentNode.getElementsByClassName("getDuration")[0];
        var hour = parseInt((ele.duration) / 3600);
        var minute = parseInt((ele.duration % 3600) / 60);
        var second = Math.ceil(ele.duration % 60);
        if (hour == 0) {
            getId.innerHTML = minute + ":" + second;
        } else {
            getId.innerHTML = hour + " : " + minute + ":" + second;
        }
    }
Tong0068 2018-09-16
  • 打赏
  • 举报
回复
我知道这个问题很菜,但是拜托了,真的不知道问题在哪

87,955

社区成员

发帖
与我相关
我的任务
社区描述
Web 开发 JavaScript
社区管理员
  • JavaScript
  • 无·法
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧