Изображения, загружаемые при создании объекта jquery - PullRequest
Новая
       52

Изображения, загружаемые при создании объекта jquery

0 голосов
/ 17 декабря 2018

У меня есть строка HTML, которая содержит несколько изображений.Я хочу визуализировать этот HTML, но без загрузки изображений (здесь будет ленивая нагрузка).Чтобы добиться этого, я создаю объект jquery из моей строки и заменяю атрибуты src: 

var html = $('<div>').html(string)
html.find('img').attr('src', 'placeholder.jpg')

Проблема в том, что когда я смотрю на содержимое, загружаемое на мою страницу, я вижу, что изображения загружаются,когда я звоню .html(string).Разве это не должно происходить только тогда, когда я фактически помещаю свой код в DOM?Если нет, есть ли другой способ проанализировать мой HTML и заменить атрибуты src в каждом теге <img>?

var string = '<div><span>lorem ipsum</span><img src="http://placekitten.com/640/480"/></div>'
var html = $('<div>').html(string)
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>

Ответы [ 2 ]

0 голосов
/ 17 декабря 2018

Таким образом, вы можете удалить изображение, но я не уверен, что вы готовы сделать еще.если вы хотите заменить только src или вам нужно удалить только тег и сохранить URL-адрес изображения. 

$("img").removeAttr("src");
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div>
  <span>lorem ipsum</span>
  <img src="http://placekitten.com/640/480" width="200" />
</div>
0 голосов
/ 17 декабря 2018

Как уже упоминалось здесь , "Если строка передается в качестве параметра в $ (), jQuery проверяет строку, чтобы увидеть, выглядит ли она как HTML (т. Е. Начинается с). Если нет, тоСтрока интерпретируется как выражение селектора, как описано выше. Но если строка выглядит как фрагмент HTML, jQuery пытается создать новые элементы DOM, как описано в HTML. "

Таким образом, он фактически создает элемент DOMи именно поэтому он начинает загружать изображения.Попробуйте использовать regex в строке HTML, чтобы найти атрибуты src перед созданием объекта jQuery.

Вы можете попробовать что-то вроде (?<=src=)("[\w\.\/]+").Улучшите его в соответствии с вашими требованиями.

...