Каков допустимый способ включить изображение без src?

другой вариант-вставить пустое изображение. Любое изображение, которое соответствует вашей цели, будет делать, но следующий пример кодирует GIF, который составляет всего 26 байт-от http://probablyprogramming.com/2009/03/15/the-tiniest-gif-ever

<img src="data:image/gif;base64,R0lGODlhAQABAAD/ACwAAAAAAQABAAACADs=" width="0" height="0" alt="" />

редактировать на основе комментария ниже:

конечно, вы должны учитывать требования к поддержке браузера. Никакой поддержки IE7 или менее не заметно. http://caniuse.com/datauri

Я рекомендую динамически добавлять элементы, и если вы используете jQuery или другую библиотеку JavaScript, это довольно просто:

• http://api.jquery.com/appendTo/
• http://api.jquery.com/prependTo/
• http://api.jquery.com/html/

также посмотреть prepend и append. В противном случае, если у вас есть такой тег изображения, и вы хотите его проверить, вы можете рассмотрите возможность использования фиктивного изображения, такого как прозрачный gif или png 1px.

Я не делал этого, но мне пришлось пройти через то же самое еще раз.

<img src="about:blank" alt="" />

мой любимый -//:0 один подразумевает, что вы попытаетесь сделать HTTP/HTTPS-соединение с исходным сервером на нулевом порту (Порт tcpmux?) - это, наверное, безвредно, но я бы предпочел не делать в любом случае. Черт возьми, браузер может увидеть нулевой порт и даже не отправить запрос. Но я бы все равно предпочел не указано, когда это вероятно не то, что вы означать.

в любом случае, рендеринг about:blank на самом деле очень быстро во всех браузерах, которые я тестировал. Я просто бросил его в валидатор W3C, и он не жаловался, поэтому он может быть даже действительным.

редактировать: не делайте этого; он не работает во всех браузерах (он покажет значок "сломанное изображение", как указано в комментариях к этому ответу). Используйте <img src='data:... Решение ниже. Или если вы не заботитесь о действительности, но все же хотите избежать лишних запросов к сервер, вы можете сделать <img alt="" /> без атрибута src. Но это недействительным HTML так что выбирайте это тщательно.

тестовая страница, показывающая целую кучу различных методов:http://desk.nu/blank_image.php - подается со всеми видами различных типов документов и типов контента. - как упоминалось в комментариях ниже, используйте новую тестовую страницу Марка Ормстона по адресу:http://memso.com/Test/BlankImage.html

как написано в комментариях, этот метод неправильный.

Я не нашел этого ответа раньше, но согласно W3 Технические Характеристики действующий пустые src тег будет якорной ссылкой #.

пример: src="#", src="#empty"

страница проверяет успешно и никакой дополнительный запрос не сделан.

Если вы держите атрибут src пустым, браузер отправит запрос на текущий url-адрес страницы всегда добавляйте 1 * 1 прозрачный img В атрибут src, если не хотите url

src="data:image/gif;base64,R0lGODlhAQABAAAAACwAAAAAAQABAAA="

Я обнаружил, что просто установка src в пустую строку и добавление правила в ваш CSS, чтобы скрыть сломанный значок изображения, отлично работает.

[src=''] {
    visibility: hidden;
}

Я нашел, что с помощью:

<img src="file://null">

не будет делать запрос и проверяет правильно.

браузеры просто заблокируют доступ к локальной файловой системе.

но может быть ошибка, отображаемая в журнале консоли в Chrome, например:

Not allowed to load local resource: file://null/

используйте действительно пустой, действительный и высоко совместимый SVG, основанный на этом статьи:

src="data:image/svg+xml;charset=utf8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%3E%3C/svg%3E"

он будет по умолчанию размером до 300x150px, как и любой SVG, но вы можете работать с этим в своем img стили по умолчанию элемента, как вам, возможно, понадобится в любом случае в практической реализации.

Я лично использую about:blank src и иметь дело с сломанной значок изображения, установив непрозрачность img элемент 0.

построение ответа Бена Бланка, единственный способ, которым я получил это для проверки в валидаторе w3, был так:

<img src="/./.:0" alt="">`

<img src="invis.gif" />

где invis.gif - это один пиксельный прозрачный gif. Это не сломается в будущих версиях браузера и работает в устаревших браузерах с 90-х годов.

png тоже должен работать, но в моих тестах gif был 43 байта, а png-167 байт, поэтому gif выиграл.

p.s. не забудьте тег alt, валидаторы тоже любят их.

просто, вот так:

<img id="give_me_src"/>