如何使用js删除html中的video视频元素控件代码

如何使用js删除html中的video视频元素控件代码

DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <title>前端播放mp4格式视频title>

head>
<body>

<div>

    <video class="videoya" data-video-duration="0" data-video_id="2" id="myVideo1" mediatype="video"
           src="https://www.qipa250.com/uploadedqrcode/douyinvideo/20221117/7132658349241404708.mp4"
           controls
           autoplay data-setup='{}' style='width: 10%;height: auto'>video>


    <video class="shipin" data-video-duration="0" data-video_id="2" id="myVideo2" mediatype="video"
           src="https://www.qipa250.com/uploadedqrcode/douyinvideo/20221117/7132658349241404708.mp4"
           controls
           autoplay data-setup='{}' style='width: 10%;height: auto'>video>


    <video class="shipin" data-video-duration="0" data-video_id="3" id="myVideo3" mediatype="video"
           src="https://www.qipa250.com/uploadedqrcode/douyinvideo/20221117/7132658349241404708.mp4" controls
           autoplay data-setup='{}' style='width: 10%;height: auto'>video>

    <a href="javascript:;" onclick="saveToPdfFile()" title="点我删除视频">
        <img style="width: 5%" src="img/pdf.png" alt="点我删除视频">
    a>

div>
<script src="https://s3.pstatp.com/cdn/expire-1-M/jquery/3.3.1/jquery.min.js">script>


<script>

    function saveToPdfFile() {
        $(".shipin").each(function () {
            removeVideo(this);
        });
    }

    //将视频元素删除掉
    function removeVideo(that) {

        let video_id = $(that).attr('data-video_id');
        let video_url = $(that).attr('src');

        console.log("checkVideo--video_id--", video_id);
        console.log("checkVideo--video_url--", video_url);

        $(that).remove();

    }

    // videoInit();


script>

body>

如何使用js删除html中的video视频元素控件代码_第1张图片点击pdf图标后,会清除video指定class元素的内容
如何使用js删除html中的video视频元素控件代码_第2张图片

你可能感兴趣的:(javascript,音视频,前端)