Как сделать в html файле динамический линк на другой локальный файл

Я использую в htm файле следующую команду:

< a href="abc.pdf" > This is a link to file abc.pdf < /a

которая даёт линк к файлу abc.pdf в той же директории и при этом высвечивает текст "This is a link to file abc.pdf". Мне нужно, чтобы этот текст высвечивался только при фактическом наличии файла abc.pdf файла, а если этого файла нет, то текст не должен появляться.

Как написать html код для этого? То есть мне нужна команда условного высвечивания текста: если файл существует, то текст появляется, если файла нет, то нет и текста.

Заранее спасибо за ответ.


Ответы (1 шт):

Автор решения: August Waltz

Можно сделать проверку отправкой http запроса на этот файл посредством JS:

<a href="abc.pdf" id="pdfLink">This is a link to file abc.pdf</a>
<script>
    fetch('abc.pdf')
        .then(response => {
            if (response.status == 200) {
                // Файл есть
                document.querySelector('a#pdfLink').style.display = 'initial';
            } else {
                // Файла нет
                document.querySelector('a#pdfLink').style.display = 'none';
            }
        })
</script>
→ Ссылка