Switching between source tags and url, videos in the video tag has not been replaced.

1. The code is as follows: the url of source in
dom has changed, but the video has not changed, and it is still the original one. What is the reason for this

  <video  controls preload="" >
    <source id="video" src="https://media.w3.org/2010/05/sintel/trailer.mp4">
  </video>
  <script>
    setTimeout(() => {
      document.querySelector("-sharpvideo").src = "http://clips.vorwaerts-gmbh.de/big_buck_bunny.mp4"
    }, 5000)
  </script>

when the source tag exists in video , the browser will automatically obtain the address after rendering. Even if the address changes, the browser will no longer obtain the address.
if there is only one source , you can consider putting the address on video by modifying the value of video src and then triggering ("- sharpvideo"). Play ();
if there are multiple source tags that can be dynamically inserted into the source tag, triggering the browser to rearrange the files of the corresponding address for playback.


I've met you before that you can switch at first, but it's not normal to switch after playing it in a loop for a few times.

so you should set the id= "video" tag on video instead of < source >

<video  controls preload=""  id="video">
    <source src="https://media.w3.org/2010/05/sintel/trailer.mp4">
  </video>
Menu