如何在DOM加载之前更改img元素的src

时间:2014-08-18 06:27:04

标签: javascript dom imagesource

我想知道是否存在向用户显示一堆图像的旋转木马,但是假设基于用户,旋转木马中显示的img需要更改为其他内容。如何在页面加载之前更改img src?我们实际上不存在DOM来获取img元素的dom元素并将其src更改为新图像?一个人怎么做呢?

我想在head部分中可能有一个内联脚本标记,其中async设置为false,这不会阻止DOM的加载。我不确定。如果此

有任何其他替代方案或html5功能,请告知我们

2 个答案:

答案 0 :(得分:1)

在加载DOM之前,您无法使用JavaScript来访问DOM。解决这个问题的最好方法是使用像把手这样的模板语言在服务器端编译HTML(取决于你的后端语言是什么)。但是,如果这不是一个选项,您也可以在图片的位置放置占位符加载符号,然后在<img>加载到DOM中后动态添加src网址,然后使用JS或jQuery来更改src属性。

希望有所帮助!

答案 1 :(得分:0)

在DOM加载之前逐字地“更改”源代码没有多大意义,否则为什么要将该源设置为开头,对吧?但正如其他人所说,Javascript将在它到达浏览器的那一刻被执行,因此如果你按照任何会话标准等加载图像源,你可以使用加载页面时的事件,执行任何特定的AJAX请求,例如使用jQuery:

$(document).ready(function() {
    $.ajax({
        url: '/getPhotos',
        success: function(res) {
            res = JSON.parse(res);
            for (var i in res) {
                $('ul#carousel').append('<li><img src="'+res[i].src+'" /></li>');
            }
        }
    });
);

你喜欢什么?