时间戳

首页 > 解决方案 > 在创建 jquery 对象时加载的图像

jquery - 在创建 jquery 对象时加载的图像

问题描述

我有一个 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>

标签： jqueryimagesrc

解决方案

正如这里提到的，“如果一个字符串作为参数传递给 $()，jQuery 会检查该字符串是否看起来像 HTML（即，它以 开头）。如果不是，则该字符串被解释为一个选择器表达式，如“

所以它实际上创建了一个 DOM 元素，这就是它开始加载图像的原因。在创建 jQuery 对象之前，尝试在 HTML 字符串上使用正则表达式来查找 src 属性。

你可以尝试类似的东西(?<=src=)("[\w\.\/]+")。改进它以满足您的要求。

推荐阅读