Home > front end >  get string inside the src attribute not the absolute path
get string inside the src attribute not the absolute path

Time:07-29

I have a video tag like this:

<video id="video-upload-preview" controls="" src="/admin/session/trimed/trimmed.mp4"></video>

and I want the string inside src so I did this:

document.getElementById('video-upload-preview').src

But the result is something else, it's the absolute path to the source not the actual string:

'https://www.example.com/admin/session/trimed/trimmed.mp4'

Is there any way to get only the string inside src attribute?

The desired result would be:

/admin/session/trimed/trimmed.mp4

CodePudding user response:

Try this:

function removeSubStr(){
    let domain = "https://stacksnippets.net"; // Here put "https://www.example.com"
    let str = document.getElementById("video-upload-preview")
                      .src.replace( domain, "" );
    document.getElementById("url").textContent = str;
}
<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
    </head>
    <body>
        <video id="video-upload-preview" controls="" src="/admin/session/trimed/trimmed.mp4"></video>
        <p id="url">Click button</p>
        <button onClick="removeSubStr()">Click</button>
    </body>
</html>

CodePudding user response:

This can be done in a shorter way.

document.getElementById('video-upload-preview').attributes.getNamedItem('src').value;
  • Related