Question

我想实现一个基本代码，它在点击时运行videojs（http://videojs.com/getting-started/）。没有功能的实现工作。但是当我在一个函数中创建它（创建DOM元素并将它们附加到正文）时，它却没有。提前致谢

<!DOCTYPE html>
<html>
    <head>
<link href="https://vjs.zencdn.net/7.0.3/video-js.css" rel="stylesheet">
        <script src="https://vjs.zencdn.net/7.0.3/video.js"></script>

        <!-- If you'd like to support IE8 (for Video.js versions prior to v7) 
            <script src="http://vjs.zencdn.net/ie8/ie8-version/videojs-ie8.min.js"></script>-->
        </head>
        <body>
            <div id = 'hello'></div>

            <video id="my-video" class="video-js" controls preload="auto" width="640" height="264"
            poster="" data-setup="{}">
            <source src="Selena_Gomez_Same_Old_Love.mp4" type='video/mp4'>
                <source src="" type='video/webm'>

                </video>

                <a href="javascript:playVideo()">Click me for playing the video</a>
                <script>
                    function playVideo(){
                        var video_element = document.createElement("VIDEO");
                        video_element.id= 'my-video';

                        video_element.class = 'video-js';

                        video_element.controls = 'auto';

                        video_element.setAttribute('preload','auto');

                        video_element.setAttribute('width','640');

                        video_element.setAttribute('height','264');







        //source
        var source_element = document.createElement("SOURCE");
        source_element.src='Selena_Gomez_Same_Old_Love.mp4';
        source_element.type= 'video/mp4';

        document.body.appendChild(video_element);
        document.body.appendChild(source_element);

    }

    </script>

    </body>
    </html>

Answer 1

我找到了答案

video_element.appendChild(source_element);
document.body.appendChild(video_element);

videojs函数内的基本实现

1 个答案: