我一直在努力加快我的页面加载速度。我有这两个延迟脚本来最小化加载时间并提高性能。
问题是只有最后一个功能会起作用。前任。如果 'imgDefer' 在最后，则只有图像会加载到首页。与 'vidDefer' 相同，如果在最后，只加载视频而不加载图像
我不知道如何将这两个 init() 结合起来。我不擅长 javascript。这些是代码：（我将这些代码放在页脚区域）
视频
<iframe src="" frameborder="0" allowfullscreen="allowfullscreen" data-src="https://www.youtube.com/embed/xxxxxx"></iframe>
图像
<img class="img-responsive" src="data:image/png;base64,R0lGODlhAQABAAD/ACwAAAAAAQABAAACADs=" data-src="imagesrource" alt="">
视频脚本
function init() {
var vidDefer = document.getElementsByTagName("iframe");
for (var s = 0; s < vidDefer.length; s++) {
if(vidDefer[s].getAttribute('data-src')) {
vidDefer[s].setAttribute('src',vidDefer[s].getAttribute('data-src'));
}
}
}
window.onload = init;
图像脚本
function init() {
var imgDefer = document.getElementsByClassName("img-responsive");
for (var i = 0; i < imgDefer.length; i++) {
if (imgDefer[i].getAttribute('data-src')) {
imgDefer[i].setAttribute('src',imgDefer[i].getAttribute('data-src'));
}
}
}
window.onload = init;
所以基本上听起来是你希望能够在window.onload事件被触发时运行多个函数。
您可以创建两个单独的函数，如下所示：
function runVideoScript() {
var vidDefer = document.getElementsByTagName('iframe')
// ...
}
function runImageScript() {
var imgDefer = document.getElementsByClassName('img-responsive')
// ...
}
然后你可以创建一个init函数。这样，两个函数都将从init函数中调用，并init在window.onload被触发时调用：
function init() {
runVideoScript()
runImageScript()
}
window.onload = init
在您当前的设置中，为什么只调用最后一个函数是因为您要替换window.onload为另一个函数，并且基本上忽略了第一个函数。
本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
我来说两句