javascript - Holder.js——取回 DOM 元素？

Question

holder.js

我想向我的页面动态添加占位符图像。

这样插入是行不通的:

$('<li>',{class:'file-item'})
    .append($('<img>',{'data-src':'holder.js/150x150'}))
    .append($('<span>',{class:'file-name'}).text(file.name))
    .appendTo('#file-list');

因为 holder 脚本已经运行并且没有搜索新元素。

但是，我们可以再次手动运行它:

Holder.run()

但随后它将扫描所有已添加的元素。

那么...有什么方法可以让 holder.js 创建并返回一个 DOM 元素，这样我就可以手动添加它而无需重新运行整个过程？

Answer 1

将 Node 作为 images 属性传递给 Holder.run，您将能够在任何单个图像上运行 Holder。 Holder 本身不创建 DOM 元素，它只是更改 src 值。

代码:

var image = $("<img>").attr({
    "data-src": "holder.js/300x200"
})

Holder.run({
    images: image[0]
});

image.appendTo("body");

此处为实例:http://jsfiddle.net/imsky/p3DMa/