码农知识堂 - 1000bd
  •   Python
  •   PHP
  •   JS/TS
  •   JAVA
  •   C/C++
  •   C#
  •   GO
  •   Kotlin
  •   Swift
  • JS如何正确销毁 VIDEO 和AUDIO 元素


    销毁 VIDEO 元素意味着停止视频的播放,并释放与其相关的所有资源。

    一般情况下,我们可以通过调用 VIDEO 元素的 pause() 方法来停止视频播放,然后使用 remove() 方法从 DOM 树中删除元素。

    但是,仅仅这样做可能并不能完全卸载 VIDEO 元素。如果视频正在播放或者已经加载了部分数据,那么该元素仍然会持有资源,因此可能会导致内存泄漏。为了彻底卸载 VIDEO 元素,我们需要将其赋值为 null,并且同时删除所有相关事件监听器和其他引用。

    对于音视频播放,我们需要确保正确卸载和销毁 VIDEO 元素,以提高性能并避免内存泄漏。在卸载 VIDEO 元素时,我们需要停止视频播放,清空 src 属性值,删除事件监听器,并将其赋值为 null。在销毁 VIDEO 元素时,我们需要执行卸载步骤之外,还需要将其从 DOM 树中删除,并将其赋值为 null。

    Audio 元素同理

    创建video

    1. const _video = document.createElement('video')
    2. _video.autoplay = true
    3. _video.loop = true
    4. _video.muted = true
    5. _video.src = 'xxxx'

    销毁video

    1. _video.pause()
    2. _video.removeAttribute('src')
    3. _video.load()
    4. _video = null

    这里我们除了调用 pause() 方法之外,还执行了以下操作:

    调用 removeAttribute('src') 方法,以清空 VIDEO 元素的 src 属性值,停止加载视频。
    调用 load() 方法,以确保所有相关数据都被卸载。
    将 VIDEO 元素的事件监听器设为 null(如果有的话),以避免内存泄漏。
    最后将 VIDEO 元素赋值为 null,以释放其占用的内存。

  • 相关阅读:
    「百川智能」获22亿元融资,腾讯、阿里、小米等参投
    SpringBoot+JWT实现单点登录解决方案
    Spring BeanFactory容器简介说明
    HTML学习笔记
    Java Rsa 签名 验签
    SAP ABAP Function Module 的动态调用方式使用方式介绍试读版
    用Unity同时开发【微信小游戏】【安卓】【IOS】游戏#6. 网络通信
    使用CMD修复和恢复病毒感染文件
    车载通信架构 —— DDS协议介绍
    视频号小店所需资金明细,2023最新费用详解!
  • 原文地址:https://blog.csdn.net/qq_31851435/article/details/132801525
  • 最新文章
  • 攻防演习之三天拿下官网站群
    数据安全治理学习——前期安全规划和安全管理体系建设
    企业安全 | 企业内一次钓鱼演练准备过程
    内网渗透测试 | Kerberos协议及其部分攻击手法
    0day的产生 | 不懂代码的"代码审计"
    安装scrcpy-client模块av模块异常,环境问题解决方案
    leetcode hot100【LeetCode 279. 完全平方数】java实现
    OpenWrt下安装Mosquitto
    AnatoMask论文汇总
    【AI日记】24.11.01 LangChain、openai api和github copilot
  • 热门文章
  • 十款代码表白小特效 一个比一个浪漫 赶紧收藏起来吧!!!
    奉劝各位学弟学妹们,该打造你的技术影响力了!
    五年了,我在 CSDN 的两个一百万。
    Java俄罗斯方块,老程序员花了一个周末,连接中学年代!
    面试官都震惊,你这网络基础可以啊!
    你真的会用百度吗?我不信 — 那些不为人知的搜索引擎语法
    心情不好的时候,用 Python 画棵樱花树送给自己吧
    通宵一晚做出来的一款类似CS的第一人称射击游戏Demo!原来做游戏也不是很难,连憨憨学妹都学会了!
    13 万字 C 语言从入门到精通保姆级教程2021 年版
    10行代码集2000张美女图,Python爬虫120例,再上征途
Copyright © 2022 侵权请联系2656653265@qq.com    京ICP备2022015340号-1
正则表达式工具 cron表达式工具 密码生成工具

京公网安备 11010502049817号