Đường dẫn file trong HTML

Đường dẫn file trong website là vị trí của một file trong website đó. Đường dẫn này có thể là tương đối (tham chiếu đến đường dẫn hiện tại) hoặc tuyệt đối (URL đầy đủ của file).

Cú pháp

Cú pháp như sau:

1) Đường dẫn tương đối (Relative path)

src="ImgFolder/picture.jpg"

Hoặc

src="../ImgFolder/picture.jpg"

Hoặc

src="/ImgFolder/picture.jpg"

2) Đường dẫn tuyệt đối (Absolute path)

src="https://www.tutorialspoint.com/html5/foo.mp4"

Xem ví dụ về HTML DOM Video src property:

Ví dụ

<!DOCTYPE html> <html> <head> 
<title>HTML DOM Video src</title> 
<style> 
    * { 
        padding: 2px; 
        margin:5px; 
    } 
    form { 
        width:70%; 
        margin: 0 auto; 
        text-align: center; 
    } 
    input[type="button"] { 
        border-radius: 10px; 
    } 
</style> </head> 
<body> 
<form> 
    <fieldset> 
        <legend>HTML-DOM-Video-src</legend> 
        <video id="wordPressIntro" width="320" controls src="https://www.tutorialspoint.com/html5/foo.mp4" type="video/mp4"> 
        </video><br> 
        <input type="button" onclick="getTrackDetails()" value="Lấy URL"> 
        <input type="text" id="textSelect" placeholder="Họ tên..."> 
        <div id="divDisplay"> 
        </div> 
    </fieldset> 
</form> 
<script> 
    var divDisplay = document.getElementById("divDisplay"); 
    var textSelect = document.getElementById("textSelect"); 
    var wordPressIntro = document.getElementById("wordPressIntro"); 
    function getTrackDetails() { 
        if(textSelect.value === 'admin') 
            divDisplay.textContent = 'Video URL: '+wordPressIntro.src; 
        else 
            divDisplay.textContent = 'Không cung cấp URL, Người dùng không được phép'; 
    } 
</script> </body> </html>

Kết quả

Đoạn mã trên sẽ tạo ra kết quả như sau:

1) Trước khi nhấn nút 'Lấy URL':

2) Sau khi nhấn nút 'Lấy URL':