关于前端预加载动画+后端内容

对于php开发的用户来讲，比如加载请求外部资源内容，一般用的是：curl函数或者file_get之类的函数；

那么也就相当于用户在请求你的页面，需要先等加载完外部资源的内容，才能显示页面内容；

这样对于体验不是很友好；

接下来夏柔提供一个解决方案，只需要几串前端代码即可，

效果演示

代码教程

只需要将这个javascript代码加进去：

<script>
document.addEventListener("DOMContentLoaded", function () {
// backupdata_loading_open();
// 获取表格容器和加载动画元素
var tableContainer = document.getElementById("backupTableContainer");
var loadingSpinner = document.getElementById("loadingSpinner");

// 模拟数据加载
// 此处应该替换为实际的数据请求
setTimeout(function () {
// backupdata_success_open();
// 隐藏加载动画
loadingSpinner.style.display = "none";
// 显示表格
document.getElementById("backupTable").style.display = "table";
}, 1000);

});
</script>

然后再前端的，需要加载的代码块加上这俩属性就可以了：id="backupTable" style="display: none;"