Html 如何更改主页上加载元素的顺序？

出于某种原因，我的博客主页开始加载到页面的一半，然后在加载了上面的特色图片后，滑到顶部。我不知道它为什么这样做。有人知道如何更改顺序以便从页面顶部的第一个元素加载吗

---

博客的链接是：

分析网站后，发现上面提到的图片尺寸较大，因此加载速度较慢

可以使用一种称为最小化大小的技术对它们进行压缩，而不会扭曲图像的分辨率

使用（例如）压缩图像：

---

然后再次测试

特色文章部分要求JavaScript进行渲染，但目前只有在页面上加载了所有HTML之后才执行JavaScript（可能会防止渲染阻塞问题）

目前，

是HTML/Javascript小部件中唯一呈现特色文章部分的HTML。在幕后，当JavaScript检测到上述HTML时，它会对特定的Blogger提要（

/feeds/posts/default？alt=json in-script&max-results=4

）进行Ajax调用，以获取要在该部分显示的帖子

解决此问题的一种方法是将负责呈现此功能部分的JS代码段移到小部件中出现的HTML

之后。负责此部分的特定JS代码段是-

<script>
$('.featured .HTML .widget-content').each(function() {
    var v = $(this).find("span").attr("data-label"),
        box = $(this).find("span").attr("data-type");
    if (box.match('recent')) {
        $.ajax({
            url: "/feeds/posts/default?alt=json-in-script&max-results=4",
            type: 'get',
            dataType: "jsonp",
            success: function(e) {
                var u = "";
                var h = '<ul>';
                for (var i = 0; i < e.feed.entry.length; i++) {
                    for (var j = 0; j < e.feed.entry[i].link.length; j++) {
                        if (e.feed.entry[i].link[j].rel == "alternate") {
                            u = e.feed.entry[i].link[j].href;
                            break
                        }
                    }
                    var g = e.feed.entry[i].title.$t;
                    var s = e.feed.entry[i].category[0].term;
                    var y = e.feed.entry[i].author[0].name.$t;
                    var d = e.feed.entry[i].published.$t,
                        t = d.substring(0, 4),
                        w = d.substring(5, 7),
                        f = d.substring(8, 10),
                        r = month_format[parseInt(w, 10)] + ' ' + f + ', ' + t;
                    var c = e.feed.entry[i].content.$t;
                    var $c = $('<div>').html(c);
                    if (c.indexOf("//www.youtube.com/embed/") > -1) {
                        var p = e.feed.entry[i].media$thumbnail.url;
                        var k = p
                    } else if (c.indexOf("<img") > -1) {
                        var q = $c.find('img:first').attr('src');
                        var k = q
                    } else {
                        var k = no_image
                    }
                    h += '<li><div class="featured-inner"><a href="/search/label/' + s + '" class="post-tag icon ' + s + '">' + s + '</a><a class="rcp-thumb" href="' + u + '" style="background:url(' + k + ') no-repeat center center;background-size: cover"><span class="featured-overlay"/></a><div class="post-panel"><h3 class="rcp-title"><a href="' + u + '">' + g + '</a></h3><div class="featured-meta"><span class="featured-author idel">' + y + '</span><span class="featured-date">' + r + '</span></div></div></div></li>'
                }
                h += '</ul>';
                $(".featured .HTML .widget-content").each(function() {
                    $(this).html(h);
                    $(this).find('.rcp-thumb').each(function() {
                        $(this).attr('style', function(i, src) {
                            return src.replace('/default.jpg', '/mqdefault.jpg')
                        }).attr('style', function(i, src) {
                            return src.replace('s72-c', 's1600')
                        })
                    })
                })
            }
        })
    } else if (box.match('label')) {
        $.ajax({
            url: "/feeds/posts/default/-/" + v + "?alt=json-in-script&max-results=4",
            type: 'get',
            dataType: "jsonp",
            success: function(e) {
                var u = "";
                var h = '<ul>';
                for (var i = 0; i < e.feed.entry.length; i++) {
                    for (var j = 0; j < e.feed.entry[i].link.length; j++) {
                        if (e.feed.entry[i].link[j].rel == "alternate") {
                            u = e.feed.entry[i].link[j].href;
                            break
                        }
                    }
                    var g = e.feed.entry[i].title.$t;
                    var s = e.feed.entry[i].category[0].term;
                    var y = e.feed.entry[i].author[0].name.$t;
                    var d = e.feed.entry[i].published.$t,
                        t = d.substring(0, 4),
                        w = d.substring(5, 7),
                        f = d.substring(8, 10),
                        r = month_format[parseInt(w, 10)] + ' ' + f + ', ' + t;
                    var c = e.feed.entry[i].content.$t;
                    var $c = $('<div>').html(c);
                    if (c.indexOf("//www.youtube.com/embed/") > -1) {
                        var p = e.feed.entry[i].media$thumbnail.url;
                        var k = p
                    } else if (c.indexOf("<img") > -1) {
                        var q = $c.find('img:first').attr('src');
                        var k = q
                    } else {
                        var k = no_image
                    }
                    h += '<li><div class="featured-inner"><a href="/search/label/' + s + '" class="post-tag icon ' + s + '">' + s + '</a><a class="rcp-thumb" href="' + u + '" style="background:url(' + k + ') no-repeat center center;background-size: cover"><span class="featured-overlay"/></a><div class="post-panel"><h3 class="rcp-title"><a href="' + u + '">' + g + '</a></h3><div class="featured-meta"><span class="featured-author idel">' + y + '</span><span class="featured-date">' + r + '</span></div></div></div></li>'
                }
                h += '</ul>';
                $(".featured .HTML .widget-content").each(function() {
                    $(this).html(h);
                    $(this).find('.rcp-thumb').each(function() {
                        $(this).attr('style', function(i, src) {
                            return src.replace('/default.jpg', '/mqdefault.jpg')
                        }).attr('style', function(i, src) {
                            return src.replace('s72-c', 's1600')
                        })
                    })
                })
            }
        })
    }
});

$（'.featured.HTML.widget content'）。每个（函数（）{
var v=$（this.find（“span”）.attr（“数据标签”），
box=$（this.find（“span”）.attr（“数据类型”）；
if（box.match（'recent'））{
$.ajax({
url:“/feeds/posts/default？脚本中的alt=json&max results=4”，
键入：“get”，
数据类型：“jsonp”，
成功：职能（e）{
var u=“”；
var h='
'；
for（变量i=0；i-1）{
var p=e.feed.entry[i].media$thumbnail.url；
var k=p
}如果（c.indexOf（“'+y+'+r+”）'
}
h+='
'；
$（“.featured.HTML.widget content”）.each（函数（）{
$（this.html（h）；
$（this）.find（'.rcp thumb'）.each（function（）{
$（this）.attr（'style'，function（i，src）{
返回src.replace（'/default.jpg'，'/mqdefault.jpg'）
}).attr（'style'，function（i，src）{
返回src.replace（'s72-c'，'s1600'）
})
})
})
}
})
}else if（box.match（'label'））{
$.ajax({
url:“/feeds/posts/default/-/“+v+”？脚本中的alt=json&max results=4”，
键入：“get”，
数据类型：“jsonp”，
成功：职能（e）{
var u=“”；
var h='
'；
for（变量i=0；i-1）{
var p=e.feed.entry[i].media$thumbnail.url；
var k=p
}如果（c.indexOf（“'+y+'+r+”）'
}
h+='
'；
$（“.featured.HTML.widget content”）.each（函数（）{
$（this.html（h）；
$（this）.find（'.rcp thumb'）.each（function（）{
$（this）.attr（'style'，function（i，src）{
返回src.replace（'/default.jpg'，'/mqdefault.jpg'）
}).attr（'style'，function（i，src）{
返回src.replace（'s72-c'，'s1600'）
})
})
})
}
})
}
});

---

该网站无法访问它对我来说很好@shadinamruti我刚刚尝试过，效果不错，谢谢Shadi，我会试试！嗨，Prayag，我从底部删除了JavaScript，在你说的代码之后粘贴了它，但它有问题