div 内容加载完成后，如何删除占位符？答案

【问题标题】：When div content finished loading, How do I remove the placeholder?div 内容加载完成后，如何删除占位符？
【发布时间】：2020-05-23 06:45:30
【问题描述】：

<link rel="stylesheet" href="https://unpkg.com/placeholder-loading/dist/css/placeholder-loading.min.css">
<div class="ph-item">
    <div class="ph-col-12">
        <div class="ph-picture"></div>
        <div class="ph-row">
            <div class="ph-col-6 big"></div>
            <div class="ph-col-4 empty big"></div>
            <div class="ph-col-2 big"></div>
            <div class="ph-col-4"></div>
            <div class="ph-col-8 empty"></div>
            <div class="ph-col-6"></div>
            <div class="ph-col-6 empty"></div>
            <div class="ph-col-12"></div>
        </div>
    </div>
</div>

这是我的代码。我正在使用占位符 loding css。加载 Div 内容后如何删除占位符加载器。

【问题讨论】：

div 内容在哪里加载？如果您不再需要使用<div class="ph-item">，则可以使用jQuery 将其删除。

标签： jquery css placeholder

【解决方案1】：

您只需要将其实现为尚不存在的内容的占位符，例如 Ajax 调用、渲染对象（对于 React、Vue.js 等其他框架），对于 jQuery，您可以将其删除在页面加载时，或者可能使用ajax.done() 方法等等。

以下内容可能是您的起点：

$(document).ready(function() {
  setTimeout(function(){
    $('.ph-item').replaceWith( "<h2>New heading</h2><div>Content is ready!</div>" );
  }, 1000)
});

<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
<link rel="stylesheet" href="https://unpkg.com/placeholder-loading/dist/css/placeholder-loading.min.css">
<div class="ph-item">
    <div class="ph-col-12">
        <div class="ph-picture"></div>
        <div class="ph-row">
            <div class="ph-col-6 big"></div>
            <div class="ph-col-4 empty big"></div>
            <div class="ph-col-2 big"></div>
            <div class="ph-col-4"></div>
            <div class="ph-col-8 empty"></div>
            <div class="ph-col-6"></div>
            <div class="ph-col-6 empty"></div>
            <div class="ph-col-12"></div>
        </div>
    </div>
</div>

【讨论】：

谢谢！。你能告诉我使用占位符 CSS 的最佳方法是什么
不客气！但是你想知道什么，不知道你的意思。