Javascript文件导入仅一次

Question

我的网站有问题，我使用JavaScript来显示自定义的视频播放器。我从数据库中加载了几个视频，并连续显示它们，问题是JavaScript仅适用于第一个视频。我知道我将不得不更改例如变量名以使脚本多次运行，但是是否有另一种方式可以为每个videoelement加载相同的脚本？

这是我的代码，可以更好地理解：

        while ($row = mysqli_fetch_assoc($result))

            {

            $location = "../" . $row['pfad'] . $row['video'];

            $id = $row['id'];

            ?>

            <br>

            <p><?php echo "$row[titel]"; ?></p>

            <div class="video-container">

                <div class="c-video">

                    <video id="video" class="video" src="<?php echo "$location"; ?>"></video>

                    <div class="controls">

                        <div id="process-bar" class="process-bar">

                            <div id="currentBuffer" class="currentBuffer"></div>

                            <div id="currentProcess" class="currentProcess"></div>

                        </div>

                        <div class="buttons">

                            <button id="skip-back" class="skip-back" data-skip="-10"></button>

                            <button id="play-pause"></button>

                            <button id="skip-front" class="skip-front" data-skip="10"></button>

                            <span id="videoCurrentTime" class="videoTimer"></span> <span class="videoTimer">/</span> <span id="videoTime" class="videoTimer"></span>

                            <button id="sound" class="highSound"></button>

                            <input type="range" name="volume" class="volume-slider" id="volume-slider" min="0" max="1" value="1" step="0.05">

                            <button id="fullscreen" class="fullscreen"></button>

                        </div>

                    </div>

                </div>

                <script type="text/javascript" src="../javascript/videoplayer.js"></script>

            </div>