如何在页面加载前重新排序div？

Question

我正在开发Chrome扩展程序，该扩展程序可以实现一种可能更好地对Google搜索结果进行排名的算法。

现在我了解搜索页面由10个<div>元素组成，因此我需要做的是重新排序这10个<div>个。 JS总是让我困惑的是时间。

• 如果我在页面完全加载后重新排序<div> s，结果会自动更新，还是必须重新呈现页面？
• 在页面完全加载之前重新排序<div> s怎么样？有可能吗？~~

感谢您的帮助！

更新：

现在我认为我的关键问题是，如何在页面完全加载之前更改页面内容。像“广告拦截器”之类的东西。在加载整个页面之前，“广告拦截器”如何更改页面内容？

Answer 1

跟进我的评论，这是一个快速演示，除了CSS之外只使用其他方式来反转订单：

＆＃13;

＆＃13;

body{
  flex-flow: column wrap;
  display:flex;
}


.flex-item.one {order: 5;}
.flex-item.two {order: 4;}
.flex-item.three {order: 3;}
.flex-item.four {order: 2;}
.flex-item.five {order: 1;}

＆＃13;

<div class="flex-item one"> Item 1</div>
<div class="flex-item two"> Item  2</div>
<div class="flex-item three"> Item 3</div>
<div class="flex-item four"> Item 4</div>
<div class="flex-item five"> Item 5</div>

＆＃13;

＆＃13;

＆＃13;