gpt4 book ai didi

javascript - 图像在另一个任何部分完成页面加载后加载

转载 作者:行者123 更新时间:2023-12-01 02:36:27 24 4
gpt4 key购买 nike

首先,我的主要目标是在页面加载后加载图像。接下来,我不想在 HTML 代码中指定图像标记,因此不需要提供任何 src 属性。

假设这是我的标签,应该在页面加载后加载图像

<head>
<p title="image_source" style="height:100px;width:100px;"></p>
</head>

var imagetag = document.createElement('img');
window.addEventListener('load', function() {
for (var x=0; x < document.getElementsByTagName('p').length; x++) {

}
});

最佳答案

就我个人而言,我会使用数据属性和类在页面加载后将图像添加到页面中。

window.addEventListener("load", function () {
var imgs = document.querySelectorAll(".img_load")
imgs.forEach(function (el) {
var img = document.createElement("img");
img.src = el.dataset.src
el.appendChild(img);
});
});
<p class="img_load" data-src="http://via.placeholder.com/350x150" style="height:100px;width:100px;"></p>
<p class="img_load" data-src="http://via.placeholder.com/450x150" style="height:100px;width:100px;"></p>
<p class="img_load" data-src="http://via.placeholder.com/350x450" style="height:100px;width:100px;"></p>

关于javascript - 图像在另一个任何部分完成页面加载后加载,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47872391/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com