Как я могу использовать локальные изображения в JavaScript?

Question

Полегче на меня, я ОЧЕНЬ новичок и пытаюсь учиться. Но я просто пытаюсь найти способ отображения изображений с помощью JavaScript из локального файла. Я просто пытаюсь учиться на уроках и на практике, но каждый раз, когда я хочу использовать изображение, оно должно быть с внешнего сайта, очевидно? например - ButtonImg.src = "https://somesite/button.png";

Но я хотел бы использовать только некоторые мои собственные графики. Почему я не могу сделать что-то вроде:

ButtonImg.src = "/home/username/public/button.png";

Заранее спасибо за любую помощь, это сделает обучение намного проще.

Answer 1

SMH, я такой нуб в этом, извините. Я понял. Я думаю, что на самом деле это работает так, как я думал, я просто неправильно сохранил свои изображения. И я думал, что «кодирование» будет самой сложной частью. LOL Извините снова. но спасибо за быстрые ответы. : D

Answer 2

Когда вы ссылаетесь на файл на своем собственном веб-сайте, у вас есть три варианта:

• Относительный путь : эта ссылка начинаетсяотносительно файла, из которого вы ссылаетесь на изображение. Если файлы находятся в одной папке, вам нужно только указать само имя изображения: file.jpg. Однако, если она находится в родительской папке, вы можете добавить к ссылке префикс ../, чтобы перейти к родительской папке (как если бы вы использовали команду cd): ../images/file.jpg. Если файл находится в папке sibling , вы должны ссылаться на эту папку в качестве префикса: images/file.jpg.

• Корневой путь : Это то же самое, что и относительный путь, но с префиксом /. Это относится к корневой папке сайта (/var/www/html/ на Apache). /images/file.jpg будет всегда относится к https://www.example.com/images/file.jpg, независимо от того, откуда указан файл.

• Абсолютный путь : Это абсолютная ссылка на файл, так как он будет доступен напрямую из веб-браузера. Например: https:://www.example.com/images/file.jpg.

Существует также возможность ссылаться на файл по протоколу file://, хотя имейте в виду, что он ссылается на файл в local диск;он не будет доступен для других пользователей, просматривающих веб-сайт.

Имейте в виду, что во всех трех случаях вам необходимо убедиться, что изображение действительно загружено на сервер (и включено впроект в интегрированной IDE), в дополнение к файлу на него есть ссылка из!

Answer 3

Я рекомендую перетащить файл из проводника в браузер, затем скопировать ссылку и использовать ее в нужной строке кода. Для Windows он должен начинаться с:

file:///C:/, а затем файлы для просмотра.