Как предотвратить загрузку тега <img>?

У меня есть следующий скрипт, который берет строку с информацией html (содержащей также ссылку на изображения).Как предотвратить загрузку тега <img>?

Когда я создаю элемент DOM, содержимое для изображения загружается браузером. Я хотел бы знать, можно ли остановить этот Бовуар и временно предотвратить загрузку.

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

relativeToAbosluteImgUrls: function(html, absoluteUrl) { 
     var tempDom = document.createElement('div'); 
     debugger 
     tempDom.innerHTML = html; 
     var imgs = tempDom.getElementsByTagName('img'), i = imgs.length; 
     while (i--) { 
      var srcRel = imgs[i].getAttribute('src'); 
      imgs[i].setAttribute('src', absoluteUrl + srcRel); 
     } 
     return tempDom.innerHTML; 
    },

источник

2013-10-03 GibboK

Как только вы установите 'src' атрибут, загрузка начнется. Поэтому решение было бы не устанавливать атрибут 'src' до тех пор, пока вы не захотите начать загрузку. – rid

Он * будет * загружаться после того, как он имеет значение для 'src'. Единственный способ остановить его загрузку - остановить ее до ее отправки клиенту (сценарий на стороне сервера). Как создается страница - это html/php/asp и т. Д.? Не принимайте предложения на стороне клиента, так как вы не можете остановить его в браузере - уже слишком поздно. – Archer

Установите собственный атрибут 'data-src', который содержит исходный код, и когда вы хотите загрузить изображение, установите фактический' src' attr – tymeJV

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

Или еще лучше были бы использовать некоторые JQuery ленивых загрузок изображений плагина, как это:

http://www.appelsiini.net/projects/lazyload

Надеется, что это помогает.

источник

2013-10-03 13:30:53 Robert

Спасибо за ваш ответ, я добавил комментарий к своему вопросу – GibboK

Храните путь src в атрибуте данных HTML5 - *, таком как data-src. Если не установлено src, браузер не будет загружать изображения. Когда вы будете готовы, чтобы загрузить изображение, просто получить URL из атрибута data-src и установить его в качестве атрибута src

$(function() { 
    // Only modify the images that have 'data-src' attribute 
    $('img[data-src]').each(function(){ 
     var src = $(this).data('src'); 
     // modify src however you need to, maybe make 
     // a function called 'getAbsoluteUrl' 
     $(this).prop('src', src); 
    }); 
});

источник

2013-10-03 13:31:44 lightswitch05

Для предотвращения снимков от шоу, вы могли бы использовать это.

$(window).loaded(function() { 
$("img").removeAttr("src"); 
});

Это может быть сложно и дать неожиданные результаты, но он делает это.

источник

2013-10-03 13:35:49 PMint

Это может удалить изображения, отображаемые на странице, но Idk, если он блокирует загрузку браузера в фоновом режиме после начала загрузки в первую очередь. И так как это внутри '$ (document) .ready()', * все * тегов '', присутствующих в разметке исходной страницы, начнет загружаться. – ajp15243

Не думал об этом, хотя это может быть, это уже «шаг» ближе к ответу, если вы знаете, что я имею в виду. – PMint

Подход, популярной библиотеки изображений, Slimmage, чтобы обернуть img теги в noscript теги:

<noscript class="img"> 
    <img src="my-image.jpeg" /> 
</noscript>

веб скребки и людей с JS выключен будет видеть изображение, как если бы noscript не было там, но другие браузеры полностью игнорируют noscriptиimg теги.

Вы можете использовать JavaScript, чтобы делать все, что вы хотите с ним, например (с помощью JQuery):

$('noscript.img').replaceWith(function(){ 
    return $(this.innerText).removeAttr('src'); 
});

источник

2015-03-04 14:31:30 Tamlyn

Как предотвратить загрузку тега <img>?

ответ

Смежные вопросы